Named color · #C4ABD4
Purple Gala
Purple Gala is #C4ABD4: rgb(196 171 212), hsl(277 32% 75%), oklch(0.776 0.063 312.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Purple Gala color name →
#C4ABD4
oklch(0.776 0.063 312.2)
Color conversions
- HEX
- #c4abd4
- RGB
- rgb(196 171 212)
- HSL
- hsl(277 32% 75%)
- HWB
- hwb(277 67% 17%)
- OKLCH
- oklch(0.776 0.063 312.2)
- OKLab
- oklab(0.776 0.043 -0.047)
- CIE Lab
- lab(73.2 14.99 -17.39)
- LCH
- lch(73.2 22.96 310.8)
- CMYK
- cmyk(8% 19% 0% 17%)
Tints · Shades · Tones
Tints
- CAB3D8
- D0BBDD
- D5C4E1
- DBCCE5
- E1D5EA
- E7DDEE
- EDE5F2
- F3EEF7
- F9F6FB
Shades
- AA94B8
- 917E9D
- 786883
- 615469
- 4A4051
- 352D3A
- 211B24
- 0E0B10
- 020102
Tones
- BDA7CB
- B6A2C3
- AF9EBA
- A89AB2
- A195A9
- 9B91A1
- 948D99
- 8D8990
- 878488
Color harmonies
Complementary +180°
- C4ABD4
Purple Gala
- A7BF95
≈ Japanese Horseradish
Analogous -30° +30°
- C4ABD4
Purple Gala
- AFB2DE
≈ Beloved
- D4A7C1
≈ Heart to Heart
Triadic +120° +240°
- C4ABD4
Purple Gala
- D0B08A
≈ Cracker Bitz
- 86C4C1
≈ Enchanted Isle
Split-complementary +150° +210°
- C4ABD4
Purple Gala
- BEB889
≈ Baby Bok Choy
- 92C3AA
≈ Spearmint Frosting
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.07:1 · APCA Lc 41
Ag
AAAOn black
WCAG 10.12:1 · APCA Lc 62
Best text color: #000000
WCAG 10.12:1 (AAA) · APCA Lc 62
Contrast pairs
Code snippets
CSS
:root {
--purple-gala: #c4abd4;
--purple-gala-rgb: 196 171 212;
--purple-gala-oklch: oklch(0.776 0.063 312.2);
}
.element {
color: var(--purple-gala);
background-color: hsl(277 32% 75%);
border-color: oklch(0.776 0.063 312.2);
}Tailwind CSS v4
@theme {
--color-purple-gala: #c4abd4;
--color-purple-gala-50: #fcf0ff;
--color-purple-gala-100: #f0e2f7;
--color-purple-gala-200: #decde8;
--color-purple-gala-300: #c3aecf;
--color-purple-gala-400: #ab94ba;
--color-purple-gala-500: #947aa5;
--color-purple-gala-600: #7e688b;
--color-purple-gala-700: #655370;
--color-purple-gala-800: #493c53;
--color-purple-gala-900: #33293a;
--color-purple-gala-950: #1e1724;
}SCSS
$purple-gala: #c4abd4;
$purple-gala-rgb: 196, 171, 212;
$purple-gala-light: mix(#fff, $purple-gala, 20%);
$purple-gala-dark: mix(#000, $purple-gala, 20%);
.element {
color: $purple-gala;
box-shadow: 0 0 0 2px rgba($purple-gala, 0.35);
}