Named color · #EAB7A8
Plushy Pink
Plushy Pink is #EAB7A8: rgb(234 183 168), hsl(14 61% 79%), oklch(0.821 0.063 37). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Plushy Pink color name →
#EAB7A8
oklch(0.821 0.063 37)
Color conversions
- HEX
- #eab7a8
- RGB
- rgb(234 183 168)
- HSL
- hsl(14 61% 79%)
- HWB
- hwb(14 66% 8%)
- OKLCH
- oklch(0.821 0.063 37)
- OKLab
- oklab(0.821 0.05 0.038)
- CIE Lab
- lab(78.83 17.46 15.1)
- LCH
- lch(78.83 23.08 40.8)
- CMYK
- cmyk(0% 22% 28% 8%)
Tints · Shades · Tones
Tints
- ECBEB1
- EFC5B9
- F1CCC2
- F3D4CA
- F5DBD3
- F8E2DC
- FAE9E4
- FBF0ED
- FDF8F6
Shades
- CB9F92
- AE877C
- 917067
- 755A52
- 5A453F
- 41312C
- 291E1A
- 130C0A
- 030201
Tones
- DFB1A4
- D4ACA0
- CAA69C
- BFA198
- B49B94
- AA9690
- 9F908C
- 958B88
- 8A8584
Color harmonies
Complementary +180°
- EAB7A8
Plushy Pink
- 96CFDF
≈ Washed Blue
Analogous -30° +30°
- EAB7A8
Plushy Pink
- EAB4BD
≈ Frozen Veins
- E1BD99
≈ Only Natural
Triadic +120° +240°
- EAB7A8
Plushy Pink
- A3D1B4
≈ Feather Green
- BAC2EE
≈ Vodka
Split-complementary +150° +210°
- EAB7A8
Plushy Pink
- 95D2CB
≈ Summer Soft Blue
- A4C9EC
≈ Island Light
Tetradic +90° +180° +270°
- EAB7A8
Plushy Pink
- B9CDA1
≈ New Frond
- 96CFDF
≈ Washed Blue
- CFBAE5
≈ Drifting Dream
Contrast & accessibility
Ag
FailOn white
WCAG 1.77:1 · APCA Lc 33
Ag
AAAOn black
WCAG 11.83:1 · APCA Lc 70
Best text color: #000000
WCAG 11.83:1 (AAA) · APCA Lc 70
Contrast pairs
Code snippets
CSS
:root {
--plushy-pink: #eab7a8;
--plushy-pink-rgb: 234 183 168;
--plushy-pink-oklch: oklch(0.821 0.063 37);
}
.element {
color: var(--plushy-pink);
background-color: hsl(14 61% 79%);
border-color: oklch(0.821 0.063 37);
}Tailwind CSS v4
@theme {
--color-plushy-pink: #eab7a8;
--color-plushy-pink-50: #fff0e8;
--color-plushy-pink-100: #fce1d9;
--color-plushy-pink-200: #edccc1;
--color-plushy-pink-300: #d5ada0;
--color-plushy-pink-400: #c09284;
--color-plushy-pink-500: #ab7868;
--color-plushy-pink-600: #916559;
--color-plushy-pink-700: #745147;
--color-plushy-pink-800: #563b34;
--color-plushy-pink-900: #3c2823;
--color-plushy-pink-950: #261612;
}SCSS
$plushy-pink: #eab7a8;
$plushy-pink-rgb: 234, 183, 168;
$plushy-pink-light: mix(#fff, $plushy-pink, 20%);
$plushy-pink-dark: mix(#000, $plushy-pink, 20%);
.element {
color: $plushy-pink;
box-shadow: 0 0 0 2px rgba($plushy-pink, 0.35);
}