Named color · #BB88FF
Lilac Geode
Lilac Geode is #BB88FF: rgb(187 136 255), hsl(266 100% 77%), oklch(0.725 0.173 302.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Lilac Geode color name →
#BB88FF
oklch(0.725 0.173 302.1)
Color conversions
- HEX
- #bb88ff
- RGB
- rgb(187 136 255)
- HSL
- hsl(266 100% 77%)
- HWB
- hwb(266 53% 0%)
- OKLCH
- oklch(0.725 0.173 302.1)
- OKLab
- oklab(0.725 0.092 -0.146)
- CIE Lab
- lab(65.57 37.56 -52.67)
- LCH
- lch(65.57 64.69 305.5)
- CMYK
- cmyk(27% 47% 0% 0%)
Tints · Shades · Tones
Tints
- C195FF
- C8A1FF
- CFADFF
- D5B9FF
- DCC5FF
- E3D1FF
- EADCFF
- F1E8FF
- F8F3FF
Shades
- A275DE
- 8A63BE
- 73529E
- 5C4180
- 463163
- 322248
- 1F132E
- 0D0616
- 020103
Tones
- B588F2
- AF88E5
- A988D9
- A387CC
- 9D86BF
- 9785B3
- 9184A6
- 8B8399
- 86828D
Color harmonies
Complementary +180°
- BB88FF
Lilac Geode
- 94B60F
≈ Salty Thyme
Analogous -30° +30°
- BB88FF
Lilac Geode
- 879FFF
≈ Periwinkle Blue
- E379D6
≈ Hibiscus Pop
Triadic +120° +240°
- BB88FF
Lilac Geode
- EE8A00
≈ Elden Ring Orange
- 00C0AC
≈ Turquoise
Split-complementary +150° +210°
- BB88FF
Lilac Geode
- C7A200
≈ La Vida
- 33C46D
≈ Algal Fuel
Tetradic +90° +180° +270°
- BB88FF
Lilac Geode
- FF775E
≈ Peachy Pinky
- 94B60F
≈ Salty Thyme
- 00BAD4
≈ Maldives
Contrast & accessibility
Ag
FailOn white
WCAG 2.59:1 · APCA Lc 51
Ag
AAAOn black
WCAG 8.07:1 · APCA Lc 51
Best text color: #000000
WCAG 8.07:1 (AAA) · APCA Lc 51
Contrast pairs
Code snippets
CSS
:root {
--lilac-geode: #bb88ff;
--lilac-geode-rgb: 187 136 255;
--lilac-geode-oklch: oklch(0.725 0.173 302.1);
}
.element {
color: var(--lilac-geode);
background-color: hsl(266 100% 77%);
border-color: oklch(0.725 0.173 302.1);
}Tailwind CSS v4
@theme {
--color-lilac-geode: #bb88ff;
--color-lilac-geode-50: #ffeaff;
--color-lilac-geode-100: #f4daff;
--color-lilac-geode-200: #e4c2ff;
--color-lilac-geode-300: #cba0ff;
--color-lilac-geode-400: #b282f2;
--color-lilac-geode-500: #9d62e3;
--color-lilac-geode-600: #8454c0;
--color-lilac-geode-700: #6a439a;
--color-lilac-geode-800: #4c3174;
--color-lilac-geode-900: #352152;
--color-lilac-geode-950: #201037;
}SCSS
$lilac-geode: #bb88ff;
$lilac-geode-rgb: 187, 136, 255;
$lilac-geode-light: mix(#fff, $lilac-geode, 20%);
$lilac-geode-dark: mix(#000, $lilac-geode, 20%);
.element {
color: $lilac-geode;
box-shadow: 0 0 0 2px rgba($lilac-geode, 0.35);
}