Named color · #D1DAC0
Zen Garden
Zen Garden is #D1DAC0: rgb(209 218 192), hsl(81 26% 80%), oklch(0.874 0.036 122.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Zen Garden color name →
#D1DAC0
oklch(0.874 0.036 122.7)
Color conversions
- HEX
- #d1dac0
- RGB
- rgb(209 218 192)
- HSL
- hsl(81 26% 80%)
- HWB
- hwb(81 75% 15%)
- OKLCH
- oklch(0.874 0.036 122.7)
- OKLab
- oklab(0.874 -0.02 0.031)
- CIE Lab
- lab(85.83 -6.56 11.75)
- LCH
- lch(85.83 13.46 119.1)
- CMYK
- cmyk(4% 0% 12% 15%)
Tints · Shades · Tones
Tints
- D6DEC6
- DAE1CC
- DFE5D3
- E3E9D9
- E8ECDF
- ECF0E6
- F1F4EC
- F6F8F2
- FAFBF9
Shades
- B5BDA7
- 9BA28E
- 818776
- 686C5F
- 505449
- 393C34
- 232520
- 10110E
- 020202
Tones
- C9D1B9
- C0C7B3
- B8BEAC
- B0B5A6
- A8ACA0
- A0A399
- 989A93
- 90918D
- 888986
Color harmonies
Complementary +180°
- D1DAC0
Zen Garden
- DAD0EA
≈ Shimmering Sky
Analogous -30° +30°
- D1DAC0
Zen Garden
- DED6BB
≈ Caraway Seeds
- C5DDCA
≈ Misty Afternoon
Triadic +120° +240°
- D1DAC0
Zen Garden
- C2D9EC
≈ Comet Tail
- ECCCD3
≈ Donquixote Doflamingo
Split-complementary +150° +210°
- D1DAC0
Zen Garden
- CDD5EE
≈ Garden Fairy
- E5CDE0
≈ Vanity Pink
Tetradic +90° +180° +270°
- D1DAC0
Zen Garden
- BCDDE4
≈ Disappearing Island
- DAD0EA
≈ Shimmering Sky
- EDCEC7
≈ Charmed
Contrast & accessibility
Ag
FailOn white
WCAG 1.44:1 · APCA Lc 21
Ag
AAAOn black
WCAG 14.50:1 · APCA Lc 82
Best text color: #000000
WCAG 14.50:1 (AAA) · APCA Lc 82
Contrast pairs
Code snippets
CSS
:root {
--zen-garden: #d1dac0;
--zen-garden-rgb: 209 218 192;
--zen-garden-oklch: oklch(0.874 0.036 122.7);
}
.element {
color: var(--zen-garden);
background-color: hsl(81 26% 80%);
border-color: oklch(0.874 0.036 122.7);
}Tailwind CSS v4
@theme {
--color-zen-garden: #d1dac0;
--color-zen-garden-50: #f3f7ec;
--color-zen-garden-100: #e5eadd;
--color-zen-garden-200: #d1d7c7;
--color-zen-garden-300: #b3bba7;
--color-zen-garden-400: #9aa28b;
--color-zen-garden-500: #828a70;
--color-zen-garden-600: #6e755f;
--color-zen-garden-700: #585e4c;
--color-zen-garden-800: #404436;
--color-zen-garden-900: #2c2f25;
--color-zen-garden-950: #191c14;
}SCSS
$zen-garden: #d1dac0;
$zen-garden-rgb: 209, 218, 192;
$zen-garden-light: mix(#fff, $zen-garden, 20%);
$zen-garden-dark: mix(#000, $zen-garden, 20%);
.element {
color: $zen-garden;
box-shadow: 0 0 0 2px rgba($zen-garden, 0.35);
}