Couleur nommée · #D8D7CA
Light Livingstone
Light Livingstone correspond à #D8D7CA : rgb(216 215 202), hsl(56 15% 82%), oklch(0.876 0.018 103.2). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Gray mean? → · Light Livingstone color name →
#D8D7CA
oklch(0.876 0.018 103.2)
Conversions de couleur
- HEX
- #d8d7ca
- RGB
- rgb(216 215 202)
- HSL
- hsl(56 15% 82%)
- HWB
- hwb(56 79% 15%)
- OKLCH
- oklch(0.876 0.018 103.2)
- OKLab
- oklab(0.876 -0.004 0.017)
- CIE Lab
- lab(85.79 -1.34 6.57)
- LCH
- lch(85.79 6.7 101.5)
- CMYK
- cmyk(0% 0% 6% 15%)
Teintes · Ombres · Tons
Teintes
- DCDBCF
- E0DFD4
- E4E3DA
- E7E7DF
- EBEBE4
- EFEFEA
- F3F3EF
- F7F7F4
- FBFBFA
Ombres
- BCBBAF
- A09F95
- 85857C
- 6B6B64
- 53524D
- 3B3B37
- 252522
- 11110F
- 020202
Tons
- CFCEC2
- C6C5BB
- BDBCB3
- B4B3AC
- ABAAA4
- A2A29D
- 999996
- 91918E
- 888887
Harmonies de couleurs
Complémentaire +180°
- D8D7CA
Light Livingstone
- D4D5E2
≈ Hint of Violet
Analogue -30° +30°
- D8D7CA
Light Livingstone
- DED5CA
≈ Almond Beige
- D2D9CD
≈ Light Gentle Calm
Triadique +120° +240°
- D8D7CA
Light Livingstone
- CBD9DF
≈ Moonmist
- DFD2D9
≈ Timid Violet
Complémentaire divisée +150° +210°
- D8D7CA
Light Livingstone
- CED7E2
≈ Blue Reflection
- DAD3DF
≈ Spun Moonbeams
Tétradique +90° +180° +270°
- D8D7CA
Light Livingstone
- CADAD9
≈ Cosmic Ray
- D4D5E2
≈ Hint of Violet
- E2D2D3
≈ Secret Blush
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.44:1 · APCA Lc 21
Ag
AAASur noir
WCAG 14.49:1 · APCA Lc 82
Meilleure couleur de texte: #000000
WCAG 14.49:1 (AAA) · APCA Lc 82
Contrast pairs
Extraits de code
CSS
:root {
--light-livingstone: #d8d7ca;
--light-livingstone-rgb: 216 215 202;
--light-livingstone-oklch: oklch(0.876 0.018 103.2);
}
.element {
color: var(--light-livingstone);
background-color: hsl(56 15% 82%);
border-color: oklch(0.876 0.018 103.2);
}Tailwind CSS v4
@theme {
--color-light-livingstone: #d8d7ca;
--color-light-livingstone-50: #f6f5f0;
--color-light-livingstone-100: #e8e8e2;
--color-light-livingstone-200: #d5d5cc;
--color-light-livingstone-300: #b8b8ae;
--color-light-livingstone-400: #a09f93;
--color-light-livingstone-500: #88877a;
--color-light-livingstone-600: #737267;
--color-light-livingstone-700: #5c5b52;
--color-light-livingstone-800: #43433c;
--color-light-livingstone-900: #2f2e29;
--color-light-livingstone-950: #1b1b17;
}SCSS
$light-livingstone: #d8d7ca;
$light-livingstone-rgb: 216, 215, 202;
$light-livingstone-light: mix(#fff, $light-livingstone, 20%);
$light-livingstone-dark: mix(#000, $light-livingstone, 20%);
.element {
color: $light-livingstone;
box-shadow: 0 0 0 2px rgba($light-livingstone, 0.35);
}