Cor nomeada · #3E4364
Genie
Genie é #3E4364: rgb(62 67 100), hsl(232 23% 32%), oklch(0.393 0.056 276.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Genie color name →
#3E4364
oklch(0.393 0.056 276.9)
Conversões de cor
- HEX
- #3e4364
- RGB
- rgb(62 67 100)
- HSL
- hsl(232 23% 32%)
- HWB
- hwb(232 24% 61%)
- OKLCH
- oklch(0.393 0.056 276.9)
- OKLab
- oklab(0.393 0.007 -0.056)
- CIE Lab
- lab(29.08 4.77 -20.3)
- LCH
- lch(29.08 20.85 283.2)
- CMYK
- cmyk(38% 33% 0% 61%)
Tons claros · Sombras · Tons
Tons claros
- 4F5473
- 606582
- 737791
- 858AA0
- 989CAF
- ACAFBF
- C0C3CF
- D5D6DF
- EAEBEF
Sombras
- 353956
- 2B2F48
- 23263B
- 1A1D2E
- 121422
- 0A0C16
- 04050B
- 010103
- 000000
Tons
- 444967
- 4A4F6A
- 51556D
- 575B70
- 5E6173
- 646775
- 6B6D78
- 72747B
- 797A7D
Harmonias de cor
Complementar +180°
- 3E4364
Genie
- 4E4620
≈ Uniform Green
Análoga -30° +30°
- 3E4364
Genie
- 2C4963
≈ Majolica Blue
- 4E3E5E
≈ Powerful Mauve
Tríade +120° +240°
- 3E4364
Genie
- 603B30
≈ Painted Bark
- 2A4F3A
≈ Moselle Green
Complementar dividida +150° +210°
- 3E4364
Genie
- 5A4023
≈ Beech Brown
- 3E4B2A
≈ Bronze Tone
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
AAASobre branco
WCAG 9.58:1 · APCA Lc 92
Ag
FailSobre preto
WCAG 2.19:1 · APCA Lc 10
Melhor cor de texto: #FFFFFF
WCAG 9.58:1 (AAA) · APCA Lc 92
Contrast pairs
Trechos de código
CSS
:root {
--genie: #3e4364;
--genie-rgb: 62 67 100;
--genie-oklch: oklch(0.393 0.056 276.9);
}
.element {
color: var(--genie);
background-color: hsl(232 23% 32%);
border-color: oklch(0.393 0.056 276.9);
}Tailwind CSS v4
@theme {
--color-genie: #3e4364;
--color-genie-50: #f1f4ff;
--color-genie-100: #e3e6fb;
--color-genie-200: #ced2ed;
--color-genie-300: #b1b5d5;
--color-genie-400: #959cc0;
--color-genie-500: #7c83ac;
--color-genie-600: #696f91;
--color-genie-700: #545974;
--color-genie-800: #3c4156;
--color-genie-900: #292d3c;
--color-genie-950: #171a26;
}SCSS
$genie: #3e4364;
$genie-rgb: 62, 67, 100;
$genie-light: mix(#fff, $genie, 20%);
$genie-dark: mix(#000, $genie, 20%);
.element {
color: $genie;
box-shadow: 0 0 0 2px rgba($genie, 0.35);
}