Named color · #DC9F9F
Pink Pussycat
Pink Pussycat is #DC9F9F: rgb(220 159 159), hsl(0 47% 74%), oklch(0.761 0.073 18.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Pink Pussycat color name →
#DC9F9F
oklch(0.761 0.073 18.9)
Color conversions
- HEX
- #dc9f9f
- RGB
- rgb(220 159 159)
- HSL
- hsl(0 47% 74%)
- HWB
- hwb(0 62% 14%)
- OKLCH
- oklch(0.761 0.073 18.9)
- OKLab
- oklab(0.761 0.069 0.024)
- CIE Lab
- lab(71.47 23.37 9.48)
- LCH
- lch(71.47 25.22 22.1)
- CMYK
- cmyk(0% 28% 28% 14%)
Tints · Shades · Tones
Tints
- E0A8A8
- E4B2B2
- E8BBBB
- EBC5C5
- EFCFCE
- F2D8D8
- F6E2E1
- F9ECEB
- FCF5F5
Shades
- BF8A8A
- A37575
- 886161
- 6E4D4D
- 543B3B
- 3C2929
- 261818
- 110909
- 020101
Tones
- D39C9C
- CA9999
- C09696
- B79393
- AE908F
- A58D8C
- 9C8A89
- 928686
- 898383
Color harmonies
Complementary +180°
- DC9F9F
Pink Pussycat
- 77C0C3
≈ Pure Turquoise
Analogous -30° +30°
- DC9F9F
Pink Pussycat
- D59FB9
≈ Gizmo
- D8A489
≈ Shetland Pony
Triadic +120° +240°
- DC9F9F
Pink Pussycat
- 9ABD90
≈ Milly Green
- 95B3E0
≈ Echo Isles Water
Split-complementary +150° +210°
- DC9F9F
Pink Pussycat
- 82C1A9
≈ Gauss Blaster Green
- 7FBBD6
≈ Petit Four
Tetradic +90° +180° +270°
- DC9F9F
Pink Pussycat
- B5B67F
≈ Fancy Flirt
- 77C0C3
≈ Pure Turquoise
- AFAADD
≈ Maximum Blue Purple
Contrast & accessibility
Ag
FailOn white
WCAG 2.20:1 · APCA Lc 43
Ag
AAAOn black
WCAG 9.50:1 · APCA Lc 59
Best text color: #000000
WCAG 9.50:1 (AAA) · APCA Lc 59
Contrast pairs
Code snippets
CSS
:root {
--pink-pussycat: #dc9f9f;
--pink-pussycat-rgb: 220 159 159;
--pink-pussycat-oklch: oklch(0.761 0.073 18.9);
}
.element {
color: var(--pink-pussycat);
background-color: hsl(0 47% 74%);
border-color: oklch(0.761 0.073 18.9);
}Tailwind CSS v4
@theme {
--color-pink-pussycat: #dc9f9f;
--color-pink-pussycat-50: #ffedec;
--color-pink-pussycat-100: #ffdfdd;
--color-pink-pussycat-200: #f2c9c7;
--color-pink-pussycat-300: #dba9a7;
--color-pink-pussycat-400: #c68d8d;
--color-pink-pussycat-500: #b27273;
--color-pink-pussycat-600: #966161;
--color-pink-pussycat-700: #784d4e;
--color-pink-pussycat-800: #593839;
--color-pink-pussycat-900: #3e2627;
--color-pink-pussycat-950: #271415;
}SCSS
$pink-pussycat: #dc9f9f;
$pink-pussycat-rgb: 220, 159, 159;
$pink-pussycat-light: mix(#fff, $pink-pussycat, 20%);
$pink-pussycat-dark: mix(#000, $pink-pussycat, 20%);
.element {
color: $pink-pussycat;
box-shadow: 0 0 0 2px rgba($pink-pussycat, 0.35);
}