Named color · #CFDFDD
Water Baptism
Water Baptism is #CFDFDD: rgb(207 223 221), hsl(173 20% 84%), oklch(0.891 0.017 187.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Water Baptism color name →
#CFDFDD
oklch(0.891 0.017 187.9)
Color conversions
- HEX
- #cfdfdd
- RGB
- rgb(207 223 221)
- HSL
- hsl(173 20% 84%)
- HWB
- hwb(173 81% 13%)
- OKLCH
- oklch(0.891 0.017 187.9)
- OKLab
- oklab(0.891 -0.017 -0.002)
- CIE Lab
- lab(87.57 -5.82 -0.95)
- LCH
- lch(87.57 5.9 189.3)
- CMYK
- cmyk(7% 0% 1% 13%)
Tints · Shades · Tones
Tints
- D4E2E0
- D9E5E4
- DDE9E7
- E2ECEA
- E7EFEE
- ECF2F1
- F0F5F5
- F5F9F8
- FAFCFC
Shades
- B4C2C0
- 99A5A4
- 7F8A88
- 676F6E
- 4F5655
- 383D3D
- 232726
- 101211
- 020202
Tones
- C7D5D3
- BFCBCA
- B7C2C0
- AFB8B7
- A7AEAD
- 9FA5A4
- 979B9B
- 8F9292
- 888989
Color harmonies
Complementary +180°
- CFDFDD
Water Baptism
- E6D7D9
≈ Diminished Red
Analogous -30° +30°
- CFDFDD
Water Baptism
- D2DFD7
≈ Alpine Peak
- CFDEE3
≈ High Sierra
Triadic +120° +240°
- CFDFDD
Water Baptism
- DED8E4
≈ Inspired Lilac
- E3D9CF
≈ March Breeze
Split-complementary +150° +210°
- CFDFDD
Water Baptism
- E3D7DF
≈ Secret Scent
- E6D7D3
≈ Lost Love
Tetradic +90° +180° +270°
- CFDFDD
Water Baptism
- D8DAE7
≈ Eyeshadow
- E6D7D9
≈ Diminished Red
- DEDBCF
≈ White Wisp
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 {
--water-baptism: #cfdfdd;
--water-baptism-rgb: 207 223 221;
--water-baptism-oklch: oklch(0.891 0.017 187.9);
}
.element {
color: var(--water-baptism);
background-color: hsl(173 20% 84%);
border-color: oklch(0.891 0.017 187.9);
}Tailwind CSS v4
@theme {
--color-water-baptism: #cfdfdd;
--color-water-baptism-50: #f0f7f6;
--color-water-baptism-100: #e2eae9;
--color-water-baptism-200: #ccd7d6;
--color-water-baptism-300: #aebab9;
--color-water-baptism-400: #94a2a0;
--color-water-baptism-500: #7a8a88;
--color-water-baptism-600: #677573;
--color-water-baptism-700: #525d5c;
--color-water-baptism-800: #3c4443;
--color-water-baptism-900: #292f2e;
--color-water-baptism-950: #171c1b;
}SCSS
$water-baptism: #cfdfdd;
$water-baptism-rgb: 207, 223, 221;
$water-baptism-light: mix(#fff, $water-baptism, 20%);
$water-baptism-dark: mix(#000, $water-baptism, 20%);
.element {
color: $water-baptism;
box-shadow: 0 0 0 2px rgba($water-baptism, 0.35);
}