Named color · #DBA29E
Passive Pink
Passive Pink is #DBA29E: rgb(219 162 158), hsl(4 46% 74%), oklch(0.765 0.068 23.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Passive Pink color name →
#DBA29E
oklch(0.765 0.068 23.3)
Color conversions
- HEX
- #dba29e
- RGB
- rgb(219 162 158)
- HSL
- hsl(4 46% 74%)
- HWB
- hwb(4 62% 14%)
- OKLCH
- oklch(0.765 0.068 23.3)
- OKLab
- oklab(0.765 0.063 0.027)
- CIE Lab
- lab(72.05 21.35 10.82)
- LCH
- lch(72.05 23.93 26.9)
- CMYK
- cmyk(0% 26% 28% 14%)
Tints · Shades · Tones
Tints
- DFABA7
- E3B4B1
- E7BEBA
- EBC7C4
- EED0CE
- F2D9D7
- F5E3E1
- F9ECEB
- FCF6F5
Shades
- BE8C89
- A27774
- 876360
- 6D4F4D
- 543C3A
- 3C2A29
- 261918
- 110A09
- 020101
Tones
- D29F9B
- C99B98
- C09895
- B69592
- AD918F
- A48E8C
- 9B8A89
- 928786
- 898383
Color harmonies
Complementary +180°
- DBA29E
Passive Pink
- 7DC0C6
≈ Pure Turquoise
Analogous -30° +30°
- DBA29E
Passive Pink
- D6A1B6
≈ Gizmo
- D6A78A
≈ Peachy Confection
Triadic +120° +240°
- DBA29E
Passive Pink
- 99BE97
≈ Milly Green
- 9CB3DF
≈ Myrtle Flower
Split-complementary +150° +210°
- DBA29E
Passive Pink
- 84C1AF
≈ Seaborn
- 87BBD8
≈ Frozen Whisper
Tetradic +90° +180° +270°
- DBA29E
Passive Pink
- B2B885
≈ Lima Green
- 7DC0C6
≈ Pure Turquoise
- B4ABDB
≈ Purple Hibiscus
Contrast & accessibility
Ag
FailOn white
WCAG 2.17:1 · APCA Lc 43
Ag
AAAOn black
WCAG 9.67:1 · APCA Lc 60
Best text color: #000000
WCAG 9.67:1 (AAA) · APCA Lc 60
Contrast pairs
Code snippets
CSS
:root {
--passive-pink: #dba29e;
--passive-pink-rgb: 219 162 158;
--passive-pink-oklch: oklch(0.765 0.068 23.3);
}
.element {
color: var(--passive-pink);
background-color: hsl(4 46% 74%);
border-color: oklch(0.765 0.068 23.3);
}Tailwind CSS v4
@theme {
--color-passive-pink: #dba29e;
--color-passive-pink-50: #ffeeeb;
--color-passive-pink-100: #fee0dc;
--color-passive-pink-200: #f0cac5;
--color-passive-pink-300: #d8aba6;
--color-passive-pink-400: #c48f8b;
--color-passive-pink-500: #af7471;
--color-passive-pink-600: #94635f;
--color-passive-pink-700: #774f4c;
--color-passive-pink-800: #583938;
--color-passive-pink-900: #3d2726;
--color-passive-pink-950: #271515;
}SCSS
$passive-pink: #dba29e;
$passive-pink-rgb: 219, 162, 158;
$passive-pink-light: mix(#fff, $passive-pink, 20%);
$passive-pink-dark: mix(#000, $passive-pink, 20%);
.element {
color: $passive-pink;
box-shadow: 0 0 0 2px rgba($passive-pink, 0.35);
}