Named color · #EFC9B8
Pink Pieris
Pink Pieris is #EFC9B8: rgb(239 201 184), hsl(19 63% 83%), oklch(0.864 0.049 45.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Pink Pieris color name →
#EFC9B8
oklch(0.864 0.049 45.5)
Color conversions
- HEX
- #efc9b8
- RGB
- rgb(239 201 184)
- HSL
- hsl(19 63% 83%)
- HWB
- hwb(19 72% 6%)
- OKLCH
- oklch(0.864 0.049 45.5)
- OKLab
- oklab(0.864 0.034 0.035)
- CIE Lab
- lab(83.96 11.99 13.8)
- LCH
- lch(83.96 18.28 49)
- CMYK
- cmyk(0% 16% 23% 6%)
Tints · Shades · Tones
Tints
- F1CEBF
- F3D4C6
- F4D9CD
- F6DFD4
- F8E4DB
- F9E9E2
- FBEFE9
- FCF4F1
- FEFAF8
Shades
- D0AEA0
- B19588
- 947C71
- 78645B
- 5C4C45
- 423631
- 2A221E
- 140F0C
- 030202
Tones
- E3C1B2
- D8BAAD
- CDB3A7
- C1ABA1
- B6A49C
- AB9D96
- A09591
- 958E8B
- 8B8786
Color harmonies
Complementary +180°
- EFC9B8
Pink Pieris
- B1DAEB
≈ New Prince
Analogous -30° +30°
- EFC9B8
Pink Pieris
- F1C6C8
≈ Rose Aspect
- E6CEAF
≈ Classic Terra
Triadic +120° +240°
- EFC9B8
Pink Pieris
- B5DDCB
≈ Aqua Bay
- CECEF2
≈ Miami White
Split-complementary +150° +210°
- EFC9B8
Pink Pieris
- ADDDDC
≈ Blue Light
- BDD4F3
≈ Summer Birthday
Tetradic +90° +180° +270°
- EFC9B8
Pink Pieris
- C4DABA
≈ Pale Tidepool
- B1DAEB
≈ New Prince
- DFC9E9
≈ Syrian Violet
Contrast & accessibility
Ag
FailOn white
WCAG 1.53:1 · APCA Lc 25
Ag
AAAOn black
WCAG 13.71:1 · APCA Lc 79
Best text color: #000000
WCAG 13.71:1 (AAA) · APCA Lc 79
Contrast pairs
Code snippets
CSS
:root {
--pink-pieris: #efc9b8;
--pink-pieris-rgb: 239 201 184;
--pink-pieris-oklch: oklch(0.864 0.049 45.5);
}
.element {
color: var(--pink-pieris);
background-color: hsl(19 63% 83%);
border-color: oklch(0.864 0.049 45.5);
}Tailwind CSS v4
@theme {
--color-pink-pieris: #efc9b8;
--color-pink-pieris-50: #fff1e9;
--color-pink-pieris-100: #f7e3da;
--color-pink-pieris-200: #e7cec3;
--color-pink-pieris-300: #ceb0a2;
--color-pink-pieris-400: #b89687;
--color-pink-pieris-500: #a27c6b;
--color-pink-pieris-600: #89695b;
--color-pink-pieris-700: #6e5448;
--color-pink-pieris-800: #513d35;
--color-pink-pieris-900: #392a24;
--color-pink-pieris-950: #231813;
}SCSS
$pink-pieris: #efc9b8;
$pink-pieris-rgb: 239, 201, 184;
$pink-pieris-light: mix(#fff, $pink-pieris, 20%);
$pink-pieris-dark: mix(#000, $pink-pieris, 20%);
.element {
color: $pink-pieris;
box-shadow: 0 0 0 2px rgba($pink-pieris, 0.35);
}