Colore con nome · #1C3378
Twilight Express
Twilight Express è #1C3378: rgb(28 51 120), hsl(225 62% 29%), oklch(0.348 0.122 266.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Twilight Express color name →
#1C3378
oklch(0.348 0.122 266.2)
Conversioni di colore
- HEX
- #1c3378
- RGB
- rgb(28 51 120)
- HSL
- hsl(225 62% 29%)
- HWB
- hwb(225 11% 53%)
- OKLCH
- oklch(0.348 0.122 266.2)
- OKLab
- oklab(0.348 -0.008 -0.121)
- CIE Lab
- lab(22.9 11.94 -43)
- LCH
- lch(22.9 44.62 285.5)
- CMYK
- cmyk(77% 58% 0% 53%)
Tinte · Ombre · Toni
Tinte
- 2F4786
- 435A94
- 586EA2
- 6E82AF
- 8596BD
- 9CAACA
- B4BFD7
- CDD4E5
- E6E9F2
Ombre
- 172B67
- 122357
- 0D1C48
- 081439
- 050D2A
- 02071D
- 010310
- 000105
- 000001
Toni
- 253C7A
- 2E447B
- 384C7C
- 42537E
- 4C5B7F
- 56637F
- 606A80
- 6B7180
- 757980
Armonie di colore
Complementare +180°
- 1C3378
Twilight Express
- 4A3700
≈ Night in the Woods
Analogo -30° +30°
- 1C3378
Twilight Express
- 003F5B
≈ Maniac Mansion
- 412770
≈ Clear Purple
Triadico +120° +240°
- 1C3378
Twilight Express
- 6B1414
≈ Sanguine
- 004712
≈ Borg Drone
Complementare divisa +150° +210°
- 1C3378
Twilight Express
- 5A2C00
≈ Count Chocula
- 383E00
≈ Dark Olive
Tetradico +90° +180° +270°
- 1C3378
Twilight Express
- 66133C
≈ Spanish Purple
- 4A3700
≈ Night in the Woods
- 004539
≈ UP Forest Green
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 11.70:1 · APCA Lc 96
Ag
FailSu nero
WCAG 1.79:1 · APCA Lc 0
Miglior colore del testo: #FFFFFF
WCAG 11.70:1 (AAA) · APCA Lc 96
Contrast pairs
Frammenti di codice
CSS
:root {
--twilight-express: #1c3378;
--twilight-express-rgb: 28 51 120;
--twilight-express-oklch: oklch(0.348 0.122 266.2);
}
.element {
color: var(--twilight-express);
background-color: hsl(225 62% 29%);
border-color: oklch(0.348 0.122 266.2);
}Tailwind CSS v4
@theme {
--color-twilight-express: #1c3378;
--color-twilight-express-50: #e6f5ff;
--color-twilight-express-100: #d6e7ff;
--color-twilight-express-200: #bed3ff;
--color-twilight-express-300: #9db5f6;
--color-twilight-express-400: #7d9ce7;
--color-twilight-express-500: #6082d6;
--color-twilight-express-600: #526eb5;
--color-twilight-express-700: #415891;
--color-twilight-express-800: #2d416c;
--color-twilight-express-900: #1e2d4c;
--color-twilight-express-950: #0e1932;
}SCSS
$twilight-express: #1c3378;
$twilight-express-rgb: 28, 51, 120;
$twilight-express-light: mix(#fff, $twilight-express, 20%);
$twilight-express-dark: mix(#000, $twilight-express, 20%);
.element {
color: $twilight-express;
box-shadow: 0 0 0 2px rgba($twilight-express, 0.35);
}