Nearest named color · #D63187
#D63187
Nearest named color: Benevolent Pink
#D63187 (rgb(214 49 135), hsl(329 67% 52%), oklch(0.595 0.212 354.1)) is closest to the named color Benevolent Pink. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#D63187
oklch(0.595 0.212 354.1)
Color conversions
- HEX
- #d63187
- RGB
- rgb(214 49 135)
- HSL
- hsl(329 67% 52%)
- HWB
- hwb(329 19% 16%)
- OKLCH
- oklch(0.595 0.212 354.1)
- OKLab
- oklab(0.595 0.211 -0.022)
- CIE Lab
- lab(50.25 67.56 -7.35)
- LCH
- lch(50.25 67.96 353.8)
- CMYK
- cmyk(0% 77% 37% 16%)
Tints · Shades · Tones
Tints
- DD4D92
- E3649E
- E979AA
- EE8DB5
- F3A0C1
- F7B3CD
- FAC6DA
- FCD9E6
- FEECF2
Shades
- BA2975
- 9E2263
- 841A51
- 6A1341
- 520C31
- 3B0621
- 250313
- 100106
- 020001
Tones
- CF3F86
- C84B86
- C05485
- B85C84
- B06384
- A86A83
- 9F7082
- 957681
- 8B7B81
Color harmonies
Complementary +180°
- D63187
Benevolent Pink
- 00947A
≈ Pool Table
Analogous -30° +30°
- D63187
Benevolent Pink
- B844C4
≈ Ultraviolet Berl
- E1303A
≈ Alizarin
Triadic +120° +240°
- D63187
Benevolent Pink
- 7E8700
≈ Elwynn Forest Olive
- 0089BD
≈ Mermaid Dreams
Split-complementary +150° +210°
- D63187
Benevolent Pink
- 009A20
≈ Turf Master
- 00909B
≈ Coral Coast
Tetradic +90° +180° +270°
- D63187
Benevolent Pink
- A17700
≈ Nataneyu Gold
- 00947A
≈ Pool Table
- 3B73FA
≈ Hailey Blue
Contrast & accessibility
Ag
AAOn white
WCAG 4.51:1 · APCA Lc 70
Ag
AAOn black
WCAG 4.64:1 · APCA Lc 32
Best text color: #000000
WCAG 4.64:1 (AA) · APCA Lc 32
Contrast pairs
Code snippets
CSS
:root {
--benevolent-pink: #d63187;
--benevolent-pink-rgb: 214 49 135;
--benevolent-pink-oklch: oklch(0.595 0.212 354.1);
}
.element {
color: var(--benevolent-pink);
background-color: hsl(329 67% 52%);
border-color: oklch(0.595 0.212 354.1);
}Tailwind CSS v4
@theme {
--color-benevolent-pink: #d63187;
--color-benevolent-pink-50: #ffddf7;
--color-benevolent-pink-100: #ffcbea;
--color-benevolent-pink-200: #ffadd7;
--color-benevolent-pink-300: #ff85bb;
--color-benevolent-pink-400: #f85da7;
--color-benevolent-pink-500: #e6298f;
--color-benevolent-pink-600: #c22779;
--color-benevolent-pink-700: #9c1f61;
--color-benevolent-pink-800: #74154a;
--color-benevolent-pink-900: #520e33;
--color-benevolent-pink-950: #36001f;
}SCSS
$benevolent-pink: #d63187;
$benevolent-pink-rgb: 214, 49, 135;
$benevolent-pink-light: mix(#fff, $benevolent-pink, 20%);
$benevolent-pink-dark: mix(#000, $benevolent-pink, 20%);
.element {
color: $benevolent-pink;
box-shadow: 0 0 0 2px rgba($benevolent-pink, 0.35);
}