Colore con nome · #585C79
When Worlds Collide
When Worlds Collide è #585C79: rgb(88 92 121), hsl(233 16% 41%), oklch(0.483 0.047 278.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · When Worlds Collide color name →
#585C79
oklch(0.483 0.047 278.4)
Conversioni di colore
- HEX
- #585c79
- RGB
- rgb(88 92 121)
- HSL
- hsl(233 16% 41%)
- HWB
- hwb(233 35% 53%)
- OKLCH
- oklch(0.483 0.047 278.4)
- OKLab
- oklab(0.483 0.007 -0.046)
- CIE Lab
- lab(39.58 3.73 -17.03)
- LCH
- lch(39.58 17.43 282.4)
- CMYK
- cmyk(27% 24% 0% 53%)
Tinte · Ombre · Toni
Tinte
- 676B86
- 777A93
- 878AA0
- 979AAD
- A7AABA
- B8BBC8
- CACBD5
- DBDCE3
- EDEEF1
Ombre
- 4B4F68
- 3F4258
- 333648
- 282A39
- 1D1F2B
- 12141D
- 090A10
- 030305
- 000001
Toni
- 5C607A
- 60637B
- 64677B
- 686A7C
- 6C6E7D
- 70727E
- 74757E
- 78797F
- 7C7C7F
Armonie di colore
Complementare +180°
- 585C79
When Worlds Collide
- 655F40
≈ Classic Olive
Analogo -30° +30°
- 585C79
When Worlds Collide
- 496178
≈ Plum Blue
- 665773
≈ Rich Texture
Triadico +120° +240°
- 585C79
When Worlds Collide
- 76554B
≈ Terrace Brown
- 486754
≈ June Ivy
Complementare divisa +150° +210°
- 585C79
When Worlds Collide
- 705A41
≈ Alpha Male
- 566447
≈ Jalapeño Bouquet
Tetradico +90° +180° +270°
- 585C79
When Worlds Collide
- 765359
≈ Stravinsky Pink
- 655F40
≈ Classic Olive
- 3E6763
≈ Moor Pond Green
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.51:1 · APCA Lc 82
Ag
FailSu nero
WCAG 3.22:1 · APCA Lc 20
Miglior colore del testo: #FFFFFF
WCAG 6.51:1 (AA) · APCA Lc 82
Contrast pairs
Frammenti di codice
CSS
:root {
--when-worlds-collide: #585c79;
--when-worlds-collide-rgb: 88 92 121;
--when-worlds-collide-oklch: oklch(0.483 0.047 278.4);
}
.element {
color: var(--when-worlds-collide);
background-color: hsl(233 16% 41%);
border-color: oklch(0.483 0.047 278.4);
}Tailwind CSS v4
@theme {
--color-when-worlds-collide: #585c79;
--color-when-worlds-collide-50: #f2f4ff;
--color-when-worlds-collide-100: #e4e7f8;
--color-when-worlds-collide-200: #d0d2e9;
--color-when-worlds-collide-300: #b2b5d0;
--color-when-worlds-collide-400: #989cba;
--color-when-worlds-collide-500: #7f84a5;
--color-when-worlds-collide-600: #6b6f8c;
--color-when-worlds-collide-700: #565970;
--color-when-worlds-collide-800: #3e4153;
--color-when-worlds-collide-900: #2a2d3a;
--color-when-worlds-collide-950: #181a24;
}SCSS
$when-worlds-collide: #585c79;
$when-worlds-collide-rgb: 88, 92, 121;
$when-worlds-collide-light: mix(#fff, $when-worlds-collide, 20%);
$when-worlds-collide-dark: mix(#000, $when-worlds-collide, 20%);
.element {
color: $when-worlds-collide;
box-shadow: 0 0 0 2px rgba($when-worlds-collide, 0.35);
}