Named color · #A66FB5
Soft Purple
Soft Purple is #A66FB5: rgb(166 111 181), hsl(287 32% 57%), oklch(0.625 0.119 318.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Soft Purple color name →
#A66FB5
oklch(0.625 0.119 318.9)
Color conversions
- HEX
- #a66fb5
- RGB
- rgb(166 111 181)
- HSL
- hsl(287 32% 57%)
- HWB
- hwb(287 44% 29%)
- OKLCH
- oklch(0.625 0.119 318.9)
- OKLab
- oklab(0.625 0.089 -0.078)
- CIE Lab
- lab(54.74 31.46 -28.41)
- LCH
- lch(54.74 42.38 317.9)
- CMYK
- cmyk(8% 39% 0% 29%)
Tints · Shades · Tones
Tints
- AF7DBD
- B88BC4
- C199CC
- CAA8D3
- D3B6DB
- DCC4E2
- E4D3E9
- EDE1F1
- F6F0F8
Shades
- 90609D
- 7A5186
- 65426F
- 513459
- 3E2744
- 2B1A30
- 1A0E1D
- 0A040C
- 010102
Tones
- A271B0
- 9F73AB
- 9B75A5
- 9777A0
- 94799B
- 907A96
- 8C7C90
- 887D8B
- 847F85
Color harmonies
Complementary +180°
- A66FB5
Soft Purple
- 619850
≈ Wicked Witch
Analogous -30° +30°
- A66FB5
Soft Purple
- 867ACA
≈ Ube
- BC6893
≈ Malevolent Mauve
Triadic +120° +240°
- A66FB5
Soft Purple
- AE7E21
≈ Burnt Honey
- 009BA0
≈ Riviera Paradise
Split-complementary +150° +210°
- A66FB5
Soft Purple
- 8E8D29
≈ Potter Green
- 1D9E7B
≈ Tropical Kelp
Tetradic +90° +180° +270°
- A66FB5
Soft Purple
- C07042
≈ Screaming Bell Metal
- 619850
≈ Wicked Witch
- 1594C0
≈ Spa Dream
Contrast & accessibility
Ag
FailOn white
WCAG 3.77:1 · APCA Lc 65
Ag
AAOn black
WCAG 5.56:1 · APCA Lc 37
Best text color: #000000
WCAG 5.56:1 (AA) · APCA Lc 37
Contrast pairs
Code snippets
CSS
:root {
--soft-purple: #a66fb5;
--soft-purple-rgb: 166 111 181;
--soft-purple-oklch: oklch(0.625 0.119 318.9);
}
.element {
color: var(--soft-purple);
background-color: hsl(287 32% 57%);
border-color: oklch(0.625 0.119 318.9);
}Tailwind CSS v4
@theme {
--color-soft-purple: #a66fb5;
--color-soft-purple-50: #ffebff;
--color-soft-purple-100: #fbdcff;
--color-soft-purple-200: #ecc4f4;
--color-soft-purple-300: #d3a4dd;
--color-soft-purple-400: #bc87cb;
--color-soft-purple-500: #a76bb8;
--color-soft-purple-600: #8d5b9b;
--color-soft-purple-700: #71487d;
--color-soft-purple-800: #53345d;
--color-soft-purple-900: #3a2441;
--color-soft-purple-950: #24122a;
}SCSS
$soft-purple: #a66fb5;
$soft-purple-rgb: 166, 111, 181;
$soft-purple-light: mix(#fff, $soft-purple, 20%);
$soft-purple-dark: mix(#000, $soft-purple, 20%);
.element {
color: $soft-purple;
box-shadow: 0 0 0 2px rgba($soft-purple, 0.35);
}