Named color · #A152BD
Royal Gramma Purple
Royal Gramma Purple is #A152BD: rgb(161 82 189), hsl(284 45% 53%), oklch(0.578 0.174 316.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Royal Gramma Purple color name →
#A152BD
oklch(0.578 0.174 316.4)
Color conversions
- HEX
- #a152bd
- RGB
- rgb(161 82 189)
- HSL
- hsl(284 45% 53%)
- HWB
- hwb(284 32% 26%)
- OKLCH
- oklch(0.578 0.174 316.4)
- OKLab
- oklab(0.578 0.126 -0.12)
- CIE Lab
- lab(48.34 45.99 -43.05)
- LCH
- lch(48.34 62.99 316.9)
- CMYK
- cmyk(15% 57% 0% 26%)
Tints · Shades · Tones
Tints
- AB64C4
- B476CB
- BE87D2
- C798D9
- D1A9E0
- DABAE6
- E3CBED
- EDDDF3
- F6EEF9
Shades
- 8B46A4
- 763B8C
- 622F74
- 4E255D
- 3C1A47
- 2A1133
- 19081F
- 09020D
- 010002
Tones
- 9E58B7
- 9B5EB1
- 9863AC
- 9568A6
- 926DA0
- 8E719A
- 8B7593
- 87798D
- 847C87
Color harmonies
Complementary +180°
- A152BD
Royal Gramma Purple
- 428F00
≈ Christmas Green
Analogous -30° +30°
- A152BD
Royal Gramma Purple
- 7564DA
≈ Exodus Fruit
- BE458E
≈ Boat Orchid
Triadic +120° +240°
- A152BD
Royal Gramma Purple
- A26E00
≈ Golden Hind
- 008B8D
≈ Egyptian Teal
Split-complementary +150° +210°
- A152BD
Royal Gramma Purple
- 837E00
≈ Olive
- 00906A
≈ Sea Swell
Tetradic +90° +180° +270°
- A152BD
Royal Gramma Purple
- C35300
≈ Rust Orange
- 428F00
≈ Christmas Green
- 0086AC
≈ Lyrebird
Contrast & accessibility
Ag
AAOn white
WCAG 4.71:1 · APCA Lc 72
Ag
FailOn black
WCAG 4.45:1 · APCA Lc 29
Best text color: #FFFFFF
WCAG 4.71:1 (AA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--royal-gramma-purple: #a152bd;
--royal-gramma-purple-rgb: 161 82 189;
--royal-gramma-purple-oklch: oklch(0.578 0.174 316.4);
}
.element {
color: var(--royal-gramma-purple);
background-color: hsl(284 45% 53%);
border-color: oklch(0.578 0.174 316.4);
}Tailwind CSS v4
@theme {
--color-royal-gramma-purple: #a152bd;
--color-royal-gramma-purple-50: #ffe6ff;
--color-royal-gramma-purple-100: #ffd6ff;
--color-royal-gramma-purple-200: #f4bdff;
--color-royal-gramma-purple-300: #dd9af0;
--color-royal-gramma-purple-400: #c67ae2;
--color-royal-gramma-purple-500: #b259d1;
--color-royal-gramma-purple-600: #964cb1;
--color-royal-gramma-purple-700: #793d8e;
--color-royal-gramma-purple-800: #582c6b;
--color-royal-gramma-purple-900: #3d1e4b;
--color-royal-gramma-purple-950: #270d32;
}SCSS
$royal-gramma-purple: #a152bd;
$royal-gramma-purple-rgb: 161, 82, 189;
$royal-gramma-purple-light: mix(#fff, $royal-gramma-purple, 20%);
$royal-gramma-purple-dark: mix(#000, $royal-gramma-purple, 20%);
.element {
color: $royal-gramma-purple;
box-shadow: 0 0 0 2px rgba($royal-gramma-purple, 0.35);
}