#BB2DBB#BB2DBB
#BB2DBB is a mid, highly saturated purple. Relative luminance 0.160; OKLCH L 57.4% C 0.231 H 328.1°. Best body text is #FFFFFF at 4.99:1 contrast (WCAG AA passes).
Color values
| HEX | #BB2DBB |
|---|---|
| RGB | rgb(187, 45, 187) |
| HSL | hsl(300, 61%, 45%) |
| HSV | hsv(300, 76%, 73%) |
| CMYK | cmyk(0%, 75.9%, 0%, 26.7%) |
| CIE-LAB | lab(47.02, 70.32, -44.09) |
| CIE-LCH | lch(47.02, 83.00, 327.91°) |
| OKLab | oklab(57.39% 0.1963 -0.1223) |
| OKLCH | oklch(57.39% 0.231 328.1) |
| XYZ | xyz(30.4012, 16.0317, 48.4973) |
| Luminance | 0.1603 (WCAG relative) |
| Temperature | neutral |
| Family | purple |
Closest named colors
Barney
#AC1DB8
ΔE00 4.20
Purpley Pink
#C83CB9
ΔE00 4.36
Ugly Purple
#A442A0
ΔE00 5.51
Medium Purple
#9E43A2
ΔE00 5.88
Purply
#983FB2
ΔE00 6.15
Purple Pink
#D725DE
ΔE00 6.82
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BB2DBB #2DBB2D
analogous
#742DBB #BB2DBB #BB2D74
triadic
#BB2DBB #BBBB2D #2DBBBB
tetradic
#BB2DBB #BB742D #2DBB2D #2D74BB
square
#BB2DBB #BB742D #2DBB2D #2D74BB
split-complementary
#BB2DBB #74BB2D #2DBB74
monochromatic
#581558 #8A218A #BB2DBB #D550D5 #E182E1
Accessibility & contrast
On white
4.99
#BB2DBB on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.21
#BB2DBB on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #BB2DBB
4.99:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BB2DBB | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##BB2DBB | 1.00 | 4.99 | 4.21 | 4.99 |
| #FFFFFF | 4.99 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.21 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.99 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#0564BF
Deuteranopia (green-blind)
#5576B8
Tritanopia (blue-blind)
#C14573
Achromatopsia (no color)
#6F6F6F
Design tokens & code
CSS
--color: #bb2dbb; /* rgb */ color: rgb(187, 45, 187); /* oklch */ color: oklch(57.4% 0.231 328.1);
Tailwind
colors: {
custom: {
50: '#d476d0',
500: '#bb2dbb',
950: '#000000',
},
}SCSS
$custom: #bb2dbb; $custom-light: #d476d0; $custom-dark: #000000;
JSON
{
"hex": "#bb2dbb",
"rgb": {
"r": 187,
"g": 45,
"b": 187
},
"hsl": {
"h": 300,
"s": 61.207,
"l": 45.49
},
"oklch": {
"l": 0.57389,
"c": 0.23124,
"h": 328.1
},
"luminance": 0.16029
}Semantic roles & 50–950 ramp
primary
#BB2DBB
secondary
#7ACA7A
accent
#E44343
background
#FDF7FC
surface
#FBEEF9
border
#D4C9D2
text
#150A14
muted
#837C82