Named color · #A552E6
Lightish Purple
Lightish Purple is #A552E6: rgb(165 82 230), hsl(274 75% 61%), oklch(0.608 0.218 306.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Lightish Purple color name →
#A552E6
oklch(0.608 0.218 306.8)
Color conversions
- HEX
- #a552e6
- RGB
- rgb(165 82 230)
- HSL
- hsl(274 75% 61%)
- HWB
- hwb(274 32% 10%)
- OKLCH
- oklch(0.608 0.218 306.8)
- OKLab
- oklab(0.608 0.131 -0.175)
- CIE Lab
- lab(50.94 53.91 -62.26)
- LCH
- lch(50.94 82.36 310.9)
- CMYK
- cmyk(28% 64% 0% 10%)
Tints · Shades · Tones
Tints
- AE66EA
- B679ED
- BF8BF1
- C89CF4
- D1ADF6
- DABDF9
- E3CEFB
- EDDEFD
- F6EFFE
Shades
- 8F46C8
- 793BAB
- 652F8E
- 512573
- 3D1A59
- 2B1140
- 1A0828
- 0A0213
- 010003
Tones
- A159DC
- 9E60D2
- 9A66C8
- 966BBE
- 926FB4
- 8F73AA
- 8B77A0
- 877A96
- 847D8B
Color harmonies
Complementary +180°
- A552E6
Lightish Purple
- 6A9200
≈ Canopy
Analogous -30° +30°
- A552E6
Lightish Purple
- 686BFF
≈ Blue Genie
- CD3CB1
≈ Purple Pink
Triadic +120° +240°
- A552E6
Lightish Purple
- B77000
≈ Sweet Mulled Cider
- 00978D
≈ Intense Teal
Split-complementary +150° +210°
- A552E6
Lightish Purple
- 988200
≈ Thicket Green
- 009C5E
≈ Shamrock
Tetradic +90° +180° +270°
- A552E6
Lightish Purple
- E24200
≈ Macharius Solar Orange
- 6A9200
≈ Canopy
- 0092AD
≈ Cape Pond
Contrast & accessibility
Ag
FailOn white
WCAG 4.24:1 · APCA Lc 69
Ag
AAOn black
WCAG 4.94:1 · APCA Lc 33
Best text color: #000000
WCAG 4.94:1 (AA) · APCA Lc 33
Contrast pairs
Code snippets
CSS
:root {
--lightish-purple: #a552e6;
--lightish-purple-rgb: 165 82 230;
--lightish-purple-oklch: oklch(0.608 0.218 306.8);
}
.element {
color: var(--lightish-purple);
background-color: hsl(274 75% 61%);
border-color: oklch(0.608 0.218 306.8);
}Tailwind CSS v4
@theme {
--color-lightish-purple: #a552e6;
--color-lightish-purple-50: #ffe5ff;
--color-lightish-purple-100: #fdd4ff;
--color-lightish-purple-200: #efbaff;
--color-lightish-purple-300: #d895ff;
--color-lightish-purple-400: #c074ff;
--color-lightish-purple-500: #ac4df4;
--color-lightish-purple-600: #9143cd;
--color-lightish-purple-700: #7535a5;
--color-lightish-purple-800: #54267d;
--color-lightish-purple-900: #3b1a59;
--color-lightish-purple-950: #25093c;
}SCSS
$lightish-purple: #a552e6;
$lightish-purple-rgb: 165, 82, 230;
$lightish-purple-light: mix(#fff, $lightish-purple, 20%);
$lightish-purple-dark: mix(#000, $lightish-purple, 20%);
.element {
color: $lightish-purple;
box-shadow: 0 0 0 2px rgba($lightish-purple, 0.35);
}