Named color · #EFD6DA
Pale Rose
Pale Rose is #EFD6DA: rgb(239 214 218), hsl(350 44% 89%), oklch(0.898 0.028 6.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Pale Rose color name →
#EFD6DA
oklch(0.898 0.028 6.7)
Color conversions
- HEX
- #efd6da
- RGB
- rgb(239 214 218)
- HSL
- hsl(350 44% 89%)
- HWB
- hwb(350 84% 6%)
- OKLCH
- oklch(0.898 0.028 6.7)
- OKLab
- oklab(0.898 0.028 0.003)
- CIE Lab
- lab(87.81 9.44 1.35)
- LCH
- lch(87.81 9.54 8.2)
- CMYK
- cmyk(0% 10% 9% 6%)
Tints · Shades · Tones
Tints
- F1DADE
- F2DEE1
- F4E2E5
- F6E6E9
- F7EAEC
- F9EEF0
- FAF3F4
- FCF7F8
- FDFBFB
Shades
- D0BABD
- B19EA2
- 948487
- 786A6C
- 5C5254
- 423B3C
- 2A2525
- 141011
- 030202
Tones
- E3CDD1
- D8C4C7
- CDBBBE
- C1B3B5
- B6AAAC
- ABA1A3
- A0999A
- 959191
- 8B8889
Color harmonies
Complementary +180°
- EFD6DA
Pale Rose
- C9E4E0
≈ Moonlight Jade
Analogous -30° +30°
- EFD6DA
Pale Rose
- EAD7E4
≈ Snuff
- EFD7D0
≈ Delicate Blush
Triadic +120° +240°
- EFD6DA
Pale Rose
- D8E1CD
≈ Gratifying Green
- CFE0EF
≈ Vanishing Blue
Split-complementary +150° +210°
- EFD6DA
Pale Rose
- CFE3D6
≈ Light Silverton
- C9E2E9
≈ Endless Sky
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.37:1 · APCA Lc 18
Ag
AAAOn black
WCAG 15.30:1 · APCA Lc 85
Best text color: #000000
WCAG 15.30:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--pale-rose: #efd6da;
--pale-rose-rgb: 239 214 218;
--pale-rose-oklch: oklch(0.898 0.028 6.7);
}
.element {
color: var(--pale-rose);
background-color: hsl(350 44% 89%);
border-color: oklch(0.898 0.028 6.7);
}Tailwind CSS v4
@theme {
--color-pale-rose: #efd6da;
--color-pale-rose-50: #fdf2f3;
--color-pale-rose-100: #f1e4e6;
--color-pale-rose-200: #e0d0d2;
--color-pale-rose-300: #c5b2b4;
--color-pale-rose-400: #ae989b;
--color-pale-rose-500: #987f83;
--color-pale-rose-600: #806b6f;
--color-pale-rose-700: #675659;
--color-pale-rose-800: #4b3e41;
--color-pale-rose-900: #342b2d;
--color-pale-rose-950: #20181a;
}SCSS
$pale-rose: #efd6da;
$pale-rose-rgb: 239, 214, 218;
$pale-rose-light: mix(#fff, $pale-rose, 20%);
$pale-rose-dark: mix(#000, $pale-rose, 20%);
.element {
color: $pale-rose;
box-shadow: 0 0 0 2px rgba($pale-rose, 0.35);
}