Color con nombre · #E2E6EC
Genteel Lavender
Genteel Lavender es #E2E6EC: rgb(226 230 236), hsl(216 21% 91%), oklch(0.924 0.009 258.3). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Genteel Lavender color name →
#E2E6EC
oklch(0.924 0.009 258.3)
Conversiones de color
- HEX
- #e2e6ec
- RGB
- rgb(226 230 236)
- HSL
- hsl(216 21% 91%)
- HWB
- hwb(216 89% 7%)
- OKLCH
- oklch(0.924 0.009 258.3)
- OKLab
- oklab(0.924 -0.002 -0.009)
- CIE Lab
- lab(91.11 -0.57 -3.42)
- LCH
- lch(91.11 3.47 260.6)
- CMYK
- cmyk(4% 3% 0% 7%)
Tintes · Sombras · Tonos
Tintes
- E5E8EE
- E8EBF0
- EBEDF2
- EEF0F4
- F0F2F5
- F3F5F7
- F6F7F9
- F9FAFB
- FCFCFD
Sombras
- C4C8CD
- A8ABAF
- 8C8E92
- 717376
- 57595B
- 3E4042
- 272829
- 121313
- 030303
Tonos
- D8DBE1
- CED1D5
- C4C6CA
- BABCBF
- B0B2B4
- A6A7AA
- 9C9D9F
- 939395
- 898A8A
Armonías de color
Complementario +180°
- E2E6EC
Genteel Lavender
- E9E5DF
≈ Snowed In
Análogo -30° +30°
- E2E6EC
Genteel Lavender
- E0E7EB
≈ Cloud Abyss
- E5E5EC
≈ Cool Frost
Triádico +120° +240°
- E2E6EC
Genteel Lavender
- ECE3E3
≈ Cloudy Grey
- E3E7E1
≈ White Blaze
Complementario dividido +150° +210°
- E2E6EC
Genteel Lavender
- EBE4E0
≈ Winged Victory
- E6E6DF
≈ Black Squeeze
Tetrádico +90° +180° +270°
- E2E6EC
Genteel Lavender
- EBE3E7
≈ Calm Tint
- E9E5DF
≈ Snowed In
- E0E8E4
≈ Glimmer
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.25:1 · APCA Lc 13
Ag
AAASobre negro
WCAG 16.76:1 · APCA Lc 91
Mejor color de texto: #000000
WCAG 16.76:1 (AAA) · APCA Lc 91
Contrast pairs
Fragmentos de código
CSS
:root {
--genteel-lavender: #e2e6ec;
--genteel-lavender-rgb: 226 230 236;
--genteel-lavender-oklch: oklch(0.924 0.009 258.3);
}
.element {
color: var(--genteel-lavender);
background-color: hsl(216 21% 91%);
border-color: oklch(0.924 0.009 258.3);
}Tailwind CSS v4
@theme {
--color-genteel-lavender: #e2e6ec;
--color-genteel-lavender-50: #f4f5f8;
--color-genteel-lavender-100: #e6e8eb;
--color-genteel-lavender-200: #d2d4d8;
--color-genteel-lavender-300: #b5b7bc;
--color-genteel-lavender-400: #9b9fa4;
--color-genteel-lavender-500: #82868c;
--color-genteel-lavender-600: #6e7277;
--color-genteel-lavender-700: #585b5f;
--color-genteel-lavender-800: #404346;
--color-genteel-lavender-900: #2c2e30;
--color-genteel-lavender-950: #191b1c;
}SCSS
$genteel-lavender: #e2e6ec;
$genteel-lavender-rgb: 226, 230, 236;
$genteel-lavender-light: mix(#fff, $genteel-lavender, 20%);
$genteel-lavender-dark: mix(#000, $genteel-lavender, 20%);
.element {
color: $genteel-lavender;
box-shadow: 0 0 0 2px rgba($genteel-lavender, 0.35);
}