Named color · #D9DDD5
Aqua Haze
Aqua Haze is #D9DDD5: rgb(217 221 213), hsl(90 11% 85%), oklch(0.892 0.012 128.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Aqua Haze color name →
#D9DDD5
oklch(0.892 0.012 128.6)
Color conversions
- HEX
- #d9ddd5
- RGB
- rgb(217 221 213)
- HSL
- hsl(90 11% 85%)
- HWB
- hwb(90 84% 13%)
- OKLCH
- oklch(0.892 0.012 128.6)
- OKLab
- oklab(0.892 -0.007 0.009)
- CIE Lab
- lab(87.63 -2.47 3.44)
- LCH
- lch(87.63 4.24 125.7)
- CMYK
- cmyk(2% 0% 4% 13%)
Tints · Shades · Tones
Tints
- DDE0D9
- E1E4DD
- E4E7E1
- E8EAE6
- ECEEEA
- F0F1EE
- F3F5F2
- F7F8F6
- FBFCFB
Shades
- BCC0B9
- A1A49E
- 868883
- 6C6E6A
- 535551
- 3B3D3A
- 252624
- 111110
- 020202
Tones
- D0D3CC
- C7CAC3
- BDC0BB
- B4B7B2
- ABADAA
- A3A4A1
- 9A9B99
- 919290
- 888988
Color harmonies
Complementary +180°
- D9DDD5
Aqua Haze
- DED9E1
≈ Pastel Day
Analogous -30° +30°
- D9DDD5
Aqua Haze
- DDDCD3
≈ Pacific Fog
- D5DED9
≈ Iced Slate
Triadic +120° +240°
- D9DDD5
Aqua Haze
- D6DCE3
≈ Cautious Blue
- E3D8DA
≈ Forgotten Mosque
Split-complementary +150° +210°
- D9DDD5
Aqua Haze
- D9DBE3
≈ Muffled White
- E1D9DE
≈ Philanthropist Pink
Tetradic +90° +180° +270°
- D9DDD5
Aqua Haze
- D3DDE1
≈ Blue Nuance
- DED9E1
≈ Pastel Day
- E3D9D6
≈ Dreamy White
Contrast & accessibility
Ag
FailOn white
WCAG 1.37:1 · APCA Lc 18
Ag
AAAOn black
WCAG 15.25:1 · APCA Lc 85
Best text color: #000000
WCAG 15.25:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--aqua-haze: #d9ddd5;
--aqua-haze-rgb: 217 221 213;
--aqua-haze-oklch: oklch(0.892 0.012 128.6);
}
.element {
color: var(--aqua-haze);
background-color: hsl(90 11% 85%);
border-color: oklch(0.892 0.012 128.6);
}Tailwind CSS v4
@theme {
--color-aqua-haze: #d9ddd5;
--color-aqua-haze-50: #f4f6f2;
--color-aqua-haze-100: #e6e9e5;
--color-aqua-haze-200: #d2d5d0;
--color-aqua-haze-300: #b5b9b2;
--color-aqua-haze-400: #9ca099;
--color-aqua-haze-500: #848880;
--color-aqua-haze-600: #6f736c;
--color-aqua-haze-700: #595c56;
--color-aqua-haze-800: #41433f;
--color-aqua-haze-900: #2d2e2b;
--color-aqua-haze-950: #1a1b19;
}SCSS
$aqua-haze: #d9ddd5;
$aqua-haze-rgb: 217, 221, 213;
$aqua-haze-light: mix(#fff, $aqua-haze, 20%);
$aqua-haze-dark: mix(#000, $aqua-haze, 20%);
.element {
color: $aqua-haze;
box-shadow: 0 0 0 2px rgba($aqua-haze, 0.35);
}