#FAD4D8
#F8EDEB
#E8E8E4
#D8E2DC
#ECE4DB
Color Palette
#FAD4D8 · #F8EDEB · #E8E8E4 · #D8E2DC · #ECE4DB
analogous0 likes
Export for Developers
:root {
--color-1: #FAD4D8;
--color-1-rgb: 250, 212, 216;
--color-1-hsl: 354, 79%, 91%;
--color-2: #F8EDEB;
--color-2-rgb: 248, 237, 235;
--color-2-hsl: 9, 48%, 95%;
--color-3: #E8E8E4;
--color-3-rgb: 232, 232, 228;
--color-3-hsl: 60, 8%, 90%;
--color-4: #D8E2DC;
--color-4-rgb: 216, 226, 220;
--color-4-hsl: 144, 15%, 87%;
--color-5: #ECE4DB;
--color-5-rgb: 236, 228, 219;
--color-5-hsl: 32, 31%, 89%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#FAD4D8
On White
1.36:1Fail
On Black
15.47:1AAA
Aa
Aa
#F8EDEB
On White
1.15:1Fail
On Black
18.3:1AAA
Aa
Aa
#E8E8E4
On White
1.23:1Fail
On Black
17.09:1AAA
Aa
Aa
#D8E2DC
On White
1.33:1Fail
On Black
15.83:1AAA
Aa
Aa
#ECE4DB
On White
1.26:1Fail
On Black
16.69:1AAA
Aa
Aa
Contrast ratios calculated per WCAG 2.1. AA requires ≥4.5:1, AAA requires ≥7:1 for normal text.
Palette Variations
Palette Variations
Original
☀️
lighter
· Increased lightness, reduced saturation
#FBE9EB
#F7EFED
#F2F2F2
#F2F3F2
#F5F2F0
🌑
darker
· Reduced lightness, increased saturation
#F37783
#E1A89D
#BCBCA9
#9ABCA7
#CCB293
🌫️
muted
· Desaturated for a calm, muted look
#F3DDDF
#F5F1F0
#E6E6E6
#DEDEDE
#E3E3E3
⚡
vibrant
· Boosted saturation for maximum impact
#FF3347
#E96149
#C0C072
#6BC790
#D79D5B