Nearest named color · #60315E
#60315E
Nearest named color: Opulent Purple
#60315E (rgb(96 49 94), hsl(303 32% 28%), oklch(0.392 0.094 328.7)) is closest to the named color Opulent Purple. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#60315E
oklch(0.392 0.094 328.7)
Color conversions
- HEX
- #60315e
- RGB
- rgb(96 49 94)
- HSL
- hsl(303 32% 28%)
- HWB
- hwb(303 19% 62%)
- OKLCH
- oklch(0.392 0.094 328.7)
- OKLab
- oklab(0.392 0.08 -0.049)
- CIE Lab
- lab(28.07 27.07 -17.61)
- LCH
- lch(28.07 32.29 327)
- CMYK
- cmyk(0% 49% 2% 62%)
Tints · Shades · Tones
Tints
- 6F446D
- 7F577C
- 8E6B8C
- 9E7F9C
- AE93AC
- BEA8BC
- CEBDCC
- DED3DD
- EFE9EE
Shades
- 522951
- 452244
- 381A37
- 2C132B
- 200C1F
- 150614
- 0A030A
- 030103
- 000000
Tones
- 643962
- 674165
- 6B4969
- 6E516C
- 71596F
- 746173
- 776876
- 7A7079
- 7D787D
Color harmonies
Complementary +180°
- 60315E
Opulent Purple
- 185327
≈ Moor-Monster
Analogous -30° +30°
- 60315E
Opulent Purple
- 4D3870
≈ Succinct Violet
- 6C2D45
≈ Cherry Juice Red
Triadic +120° +240°
- 60315E
Opulent Purple
- 574200
≈ Sugarloaf Brown
- 004F59
≈ Kali Blue
Split-complementary +150° +210°
- 60315E
Opulent Purple
- 414C00
≈ No Emissions Green
- 005246
≈ Breathe Deeply
Tetradic +90° +180° +270°
- 60315E
Opulent Purple
- 693700
≈ Nutmeg Wood Finish
- 185327
≈ Moor-Monster
- 004B6F
≈ Pompeii Blue
Contrast & accessibility
Ag
AAAOn white
WCAG 10.00:1 · APCA Lc 93
Ag
FailOn black
WCAG 2.09:1 · APCA Lc 10
Best text color: #FFFFFF
WCAG 10.00:1 (AAA) · APCA Lc 93
Contrast pairs
Code snippets
CSS
:root {
--opulent-purple: #60315e;
--opulent-purple-rgb: 96 49 94;
--opulent-purple-oklch: oklch(0.392 0.094 328.7);
}
.element {
color: var(--opulent-purple);
background-color: hsl(303 32% 28%);
border-color: oklch(0.392 0.094 328.7);
}Tailwind CSS v4
@theme {
--color-opulent-purple: #60315e;
--color-opulent-purple-50: #ffecff;
--color-opulent-purple-100: #fbddf7;
--color-opulent-purple-200: #ecc6e7;
--color-opulent-purple-300: #d4a6ce;
--color-opulent-purple-400: #bd8bba;
--color-opulent-purple-500: #a86fa5;
--color-opulent-purple-600: #8e5e8b;
--color-opulent-purple-700: #724b70;
--color-opulent-purple-800: #533753;
--color-opulent-purple-900: #3a253a;
--color-opulent-purple-950: #241424;
}SCSS
$opulent-purple: #60315e;
$opulent-purple-rgb: 96, 49, 94;
$opulent-purple-light: mix(#fff, $opulent-purple, 20%);
$opulent-purple-dark: mix(#000, $opulent-purple, 20%);
.element {
color: $opulent-purple;
box-shadow: 0 0 0 2px rgba($opulent-purple, 0.35);
}