Cor nomeada · #1C3378
Twilight Express
Twilight Express é #1C3378: rgb(28 51 120), hsl(225 62% 29%), oklch(0.348 0.122 266.2). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Twilight Express color name →
#1C3378
oklch(0.348 0.122 266.2)
Conversões de cor
- 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%)
Tons claros · Sombras · Tons
Tons claros
- 2F4786
- 435A94
- 586EA2
- 6E82AF
- 8596BD
- 9CAACA
- B4BFD7
- CDD4E5
- E6E9F2
Sombras
- 172B67
- 122357
- 0D1C48
- 081439
- 050D2A
- 02071D
- 010310
- 000105
- 000001
Tons
- 253C7A
- 2E447B
- 384C7C
- 42537E
- 4C5B7F
- 56637F
- 606A80
- 6B7180
- 757980
Harmonias de cor
Complementar +180°
- 1C3378
Twilight Express
- 4A3700
≈ Night in the Woods
Análoga -30° +30°
- 1C3378
Twilight Express
- 003F5B
≈ Maniac Mansion
- 412770
≈ Clear Purple
Tríade +120° +240°
- 1C3378
Twilight Express
- 6B1414
≈ Sanguine
- 004712
≈ Borg Drone
Complementar dividida +150° +210°
- 1C3378
Twilight Express
- 5A2C00
≈ Count Chocula
- 383E00
≈ Dark Olive
Tétrade +90° +180° +270°
- 1C3378
Twilight Express
- 66133C
≈ Spanish Purple
- 4A3700
≈ Night in the Woods
- 004539
≈ UP Forest Green
Contraste e acessibilidade
Ag
AAASobre branco
WCAG 11.70:1 · APCA Lc 96
Ag
FailSobre preto
WCAG 1.79:1 · APCA Lc 0
Melhor cor de texto: #FFFFFF
WCAG 11.70:1 (AAA) · APCA Lc 96
Contrast pairs
Trechos de código
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);
}