Colore con nome · #234893
Cascade Twilight
Cascade Twilight è #234893: rgb(35 72 147), hsl(220 62% 36%), oklch(0.419 0.131 262.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Cascade Twilight color name →
#234893
oklch(0.419 0.131 262.5)
Conversioni di colore
- HEX
- #234893
- RGB
- rgb(35 72 147)
- HSL
- hsl(220 62% 36%)
- HWB
- hwb(220 14% 42%)
- OKLCH
- oklch(0.419 0.131 262.5)
- OKLab
- oklab(0.419 -0.017 -0.13)
- CIE Lab
- lab(31.32 8.54 -46.13)
- LCH
- lch(31.32 46.92 280.5)
- CMYK
- cmyk(76% 51% 0% 42%)
Tinte · Ombre · Toni
Tinte
- 375A9F
- 4C6CAA
- 607EB5
- 7690C0
- 8CA2CB
- A2B4D6
- B8C7E0
- D0D9EB
- E7ECF5
Ombre
- 1D3D7F
- 17336C
- 112959
- 0C1F47
- 071636
- 040D25
- 010616
- 000208
- 000001
Toni
- 2D4F92
- 365591
- 3F5B8F
- 48608E
- 52668C
- 5B6B8A
- 647188
- 6D7685
- 777B83
Armonie di colore
Complementare +180°
- 234893
Cascade Twilight
- 644700
≈ Notorious Neanderthal
Analogo -30° +30°
- 234893
Cascade Twilight
- 005474
≈ World Peace
- 513A8D
≈ Blue Gem
Triadico +120° +240°
- 234893
Cascade Twilight
- 86252A
≈ Flame Red
- 115D0E
≈ Evergreen Shade
Complementare divisa +150° +210°
- 234893
Cascade Twilight
- 783800
≈ Red Beech
- 4E5100
≈ Scorzonera Brown
Tetradico +90° +180° +270°
- 234893
Cascade Twilight
- 7F2654
≈ Pico Eggplant
- 644700
≈ Notorious Neanderthal
- 005B48
≈ Forest Shadows
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 8.67:1 · APCA Lc 89
Ag
FailSu nero
WCAG 2.41:1 · APCA Lc 13
Miglior colore del testo: #FFFFFF
WCAG 8.67:1 (AAA) · APCA Lc 89
Contrast pairs
Frammenti di codice
CSS
:root {
--cascade-twilight: #234893;
--cascade-twilight-rgb: 35 72 147;
--cascade-twilight-oklch: oklch(0.419 0.131 262.5);
}
.element {
color: var(--cascade-twilight);
background-color: hsl(220 62% 36%);
border-color: oklch(0.419 0.131 262.5);
}Tailwind CSS v4
@theme {
--color-cascade-twilight: #234893;
--color-cascade-twilight-50: #e3f6ff;
--color-cascade-twilight-100: #d2e8ff;
--color-cascade-twilight-200: #b8d4ff;
--color-cascade-twilight-300: #96b7fb;
--color-cascade-twilight-400: #749dec;
--color-cascade-twilight-500: #5583dc;
--color-cascade-twilight-600: #496fba;
--color-cascade-twilight-700: #3a5995;
--color-cascade-twilight-800: #27416f;
--color-cascade-twilight-900: #1a2d4e;
--color-cascade-twilight-950: #0a1a34;
}SCSS
$cascade-twilight: #234893;
$cascade-twilight-rgb: 35, 72, 147;
$cascade-twilight-light: mix(#fff, $cascade-twilight, 20%);
$cascade-twilight-dark: mix(#000, $cascade-twilight, 20%);
.element {
color: $cascade-twilight;
box-shadow: 0 0 0 2px rgba($cascade-twilight, 0.35);
}