#E4CCDC#E4CCDC
#E4CCDC is a very light, muted pink. Relative luminance 0.648; OKLCH L 87.0% C 0.034 H 338.0°. Best body text is #000000 at 13.97:1 contrast (WCAG AA passes).
Color values
| HEX | #E4CCDC |
|---|---|
| RGB | rgb(228, 204, 220) |
| HSL | hsl(320, 31%, 85%) |
| HSV | hsv(320, 11%, 89%) |
| CMYK | cmyk(0%, 10.5%, 3.5%, 10.6%) |
| CIE-LAB | lab(84.41, 11.11, -4.85) |
| CIE-LCH | lch(84.41, 12.12, 336.41°) |
| OKLab | oklab(86.98% 0.0317 -0.0128) |
| OKLCH | oklch(86.98% 0.034 338) |
| XYZ | xyz(66.5045, 64.8480, 76.7098) |
| Luminance | 0.6485 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Closest named colors
Thistle
#D8BFD8
ΔE00 4.33
Light Pink
#FFD1DF
ΔE00 6.59
Pale Pink
#FFCFDC
ΔE00 7.02
Lavenderblush
#FFF0F5
ΔE00 9.27
Mistyrose
#FFE4E1
ΔE00 9.37
Pale Lavender
#EECFFE
ΔE00 9.40
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#E4CCDC #CCE4D4
analogous
#E0CCE4 #E4CCDC #E4CCD0
triadic
#E4CCDC #DCE4CC #CCDCE4
tetradic
#E4CCDC #E4E0CC #CCE4D4 #CCD0E4
square
#E4CCDC #E4E0CC #CCE4D4 #CCD0E4
split-complementary
#E4CCDC #D0E4CC #CCE4E0
monochromatic
#BA7CA5 #CFA4C1 #E4CCDC #F4EBF1 #F4EBF1
Accessibility & contrast
On white
1.50
#E4CCDC on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
13.97
#E4CCDC on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #E4CCDC
13.97:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##E4CCDC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##E4CCDC | 1.00 | 1.50 | 13.97 | 13.97 |
| #FFFFFF | 1.50 | 1.00 | 21.00 | 21.00 |
| #000000 | 13.97 | 21.00 | 1.00 | 1.00 |
| ##000000 | 13.97 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CCD1DD
Deuteranopia (green-blind)
#D2D4DB
Tritanopia (blue-blind)
#E7CCD1
Achromatopsia (no color)
#D3D3D3
Design tokens & code
CSS
--color: #e4ccdc; /* rgb */ color: rgb(228, 204, 220); /* oklch */ color: oklch(87.0% 0.034 338.0);
Tailwind
colors: {
custom: {
50: '#ecdbe6',
500: '#e4ccdc',
950: '#000000',
},
}SCSS
$custom: #e4ccdc; $custom-light: #ecdbe6; $custom-dark: #000000;
JSON
{
"hex": "#e4ccdc",
"rgb": {
"r": 228,
"g": 204,
"b": 220
},
"hsl": {
"h": 320,
"s": 30.769,
"l": 84.706
},
"oklch": {
"l": 0.86978,
"c": 0.03414,
"h": 338
},
"luminance": 0.64847
}Semantic roles & 50–950 ramp
primary
#E4CCDC
secondary
#98BCA4
accent
#A9613C
background
#FEFEFE
surface
#FDFBFC
border
#D5D4D5
text
#161516
muted
#848484