Nearest named color · #BB7FFA
#BB7FFA
Nearest named color: Illicit Purple
#BB7FFA (rgb(187 127 250), hsl(269 92% 74%), oklch(0.708 0.181 304.7)) is closest to the named color Illicit Purple. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#BB7FFA
oklch(0.708 0.181 304.7)
Color conversions
- HEX
- #bb7ffa
- RGB
- rgb(187 127 250)
- HSL
- hsl(269 92% 74%)
- HWB
- hwb(269 50% 2%)
- OKLCH
- oklch(0.708 0.181 304.7)
- OKLab
- oklab(0.708 0.103 -0.149)
- CIE Lab
- lab(63.4 41.3 -53.35)
- LCH
- lch(63.4 67.47 307.7)
- CMYK
- cmyk(25% 49% 0% 2%)
Tints · Shades · Tones
Tints
- C28DFB
- C89AFD
- CFA7FE
- D6B4FF
- DCC1FF
- E3CDFF
- EADAFF
- F1E6FF
- F8F3FF
Shades
- A26ED9
- 8A5DBA
- 734C9B
- 5C3C7D
- 462D61
- 321F46
- 1F112D
- 0D0615
- 020103
Tones
- B580EE
- AF81E2
- A982D5
- A382C9
- 9D82BD
- 9782B1
- 9182A5
- 8B8199
- 86818C
Color harmonies
Complementary +180°
- BB7FFA
Illicit Purple
- 88B200
≈ Brilliant Green
Analogous -30° +30°
- BB7FFA
Illicit Purple
- 8697FF
≈ Periwinkle Blue
- E26FCD
≈ Explicit Pink
Triadic +120° +240°
- BB7FFA
Illicit Purple
- E38800
≈ Hotter Butter
- 00B9AB
≈ Verditer
Split-complementary +150° +210°
- BB7FFA
Illicit Purple
- BE9E00
≈ Perennial
- 00BF6D
≈ Times Square Screens
Tetradic +90° +180° +270°
- BB7FFA
Illicit Purple
- FC6F4D
≈ Outrageous Orange
- 88B200
≈ Brilliant Green
- 00B4D1
≈ Aquarius
Contrast & accessibility
Ag
FailOn white
WCAG 2.78:1 · APCA Lc 53
Ag
AAAOn black
WCAG 7.52:1 · APCA Lc 48
Best text color: #000000
WCAG 7.52:1 (AAA) · APCA Lc 48
Contrast pairs
Code snippets
CSS
:root {
--illicit-purple: #bb7ffa;
--illicit-purple-rgb: 187 127 250;
--illicit-purple-oklch: oklch(0.708 0.181 304.7);
}
.element {
color: var(--illicit-purple);
background-color: hsl(269 92% 74%);
border-color: oklch(0.708 0.181 304.7);
}Tailwind CSS v4
@theme {
--color-illicit-purple: #bb7ffa;
--color-illicit-purple-50: #ffe8ff;
--color-illicit-purple-100: #f7d9ff;
--color-illicit-purple-200: #e8c0ff;
--color-illicit-purple-300: #cf9dff;
--color-illicit-purple-400: #b77ff3;
--color-illicit-purple-500: #a25ee4;
--color-illicit-purple-600: #8950c0;
--color-illicit-purple-700: #6e409b;
--color-illicit-purple-800: #4f2e75;
--color-illicit-purple-900: #372052;
--color-illicit-purple-950: #220e37;
}SCSS
$illicit-purple: #bb7ffa;
$illicit-purple-rgb: 187, 127, 250;
$illicit-purple-light: mix(#fff, $illicit-purple, 20%);
$illicit-purple-dark: mix(#000, $illicit-purple, 20%);
.element {
color: $illicit-purple;
box-shadow: 0 0 0 2px rgba($illicit-purple, 0.35);
}