Named color · #CBD1E1
Sweet Emily
Sweet Emily is #CBD1E1: rgb(203 209 225), hsl(224 27% 84%), oklch(0.861 0.023 269.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Sweet Emily color name →
#CBD1E1
oklch(0.861 0.023 269.4)
Color conversions
- HEX
- #cbd1e1
- RGB
- rgb(203 209 225)
- HSL
- hsl(224 27% 84%)
- HWB
- hwb(224 80% 12%)
- OKLCH
- oklch(0.861 0.023 269.4)
- OKLab
- oklab(0.861 0 -0.023)
- CIE Lab
- lab(83.74 0.19 -8.68)
- LCH
- lch(83.74 8.68 271.3)
- CMYK
- cmyk(10% 7% 0% 12%)
Tints · Shades · Tones
Tints
- D0D6E4
- D5DAE7
- DADFEA
- E0E3ED
- E5E8F0
- EAECF3
- EFF1F6
- F4F6F9
- FAFAFC
Shades
- B0B5C4
- 969BA7
- 7D818B
- 656870
- 4D5056
- 37393E
- 222327
- 0F1012
- 020202
Tones
- C3C9D7
- BCC0CD
- B4B8C3
- ACB0B9
- A5A8AF
- 9DA0A6
- 96989C
- 8E9093
- 878889
Color harmonies
Complementary +180°
- CBD1E1
Sweet Emily
- D7D1C1
≈ Ecru White
Analogous -30° +30°
- CBD1E1
Sweet Emily
- C4D4DF
≈ Velvet Sky
- D3CEDF
≈ Lavender Haze
Triadic +120° +240°
- CBD1E1
Sweet Emily
- E0CCC9
≈ Pale Berries
- C7D6C9
≈ Slow Green
Split-complementary +150° +210°
- CBD1E1
Sweet Emily
- DDCEC3
≈ Cocoa Parfait
- CFD4C3
≈ Merry Music
Tetradic +90° +180° +270°
- CBD1E1
Sweet Emily
- DFCBD1
≈ Mega Metal Mecha
- D7D1C1
≈ Ecru White
- C2D7D2
≈ Geyser
Contrast & accessibility
Ag
FailOn white
WCAG 1.52:1 · APCA Lc 24
Ag
AAAOn black
WCAG 13.74:1 · APCA Lc 79
Best text color: #000000
WCAG 13.74:1 (AAA) · APCA Lc 79
Contrast pairs
Code snippets
CSS
:root {
--sweet-emily: #cbd1e1;
--sweet-emily-rgb: 203 209 225;
--sweet-emily-oklch: oklch(0.861 0.023 269.4);
}
.element {
color: var(--sweet-emily);
background-color: hsl(224 27% 84%);
border-color: oklch(0.861 0.023 269.4);
}Tailwind CSS v4
@theme {
--color-sweet-emily: #cbd1e1;
--color-sweet-emily-50: #f3f5fc;
--color-sweet-emily-100: #e5e8f0;
--color-sweet-emily-200: #d0d4de;
--color-sweet-emily-300: #b3b7c4;
--color-sweet-emily-400: #999ead;
--color-sweet-emily-500: #808696;
--color-sweet-emily-600: #6c717f;
--color-sweet-emily-700: #565b66;
--color-sweet-emily-800: #3f424b;
--color-sweet-emily-900: #2b2e34;
--color-sweet-emily-950: #191b1f;
}SCSS
$sweet-emily: #cbd1e1;
$sweet-emily-rgb: 203, 209, 225;
$sweet-emily-light: mix(#fff, $sweet-emily, 20%);
$sweet-emily-dark: mix(#000, $sweet-emily, 20%);
.element {
color: $sweet-emily;
box-shadow: 0 0 0 2px rgba($sweet-emily, 0.35);
}