Named color · #51304E
Plum Skin
Plum Skin is #51304E: rgb(81 48 78), hsl(305 26% 25%), oklch(0.362 0.066 330.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Plum Skin color name →
#51304E
oklch(0.362 0.066 330.1)
Color conversions
- HEX
- #51304e
- RGB
- rgb(81 48 78)
- HSL
- hsl(305 26% 25%)
- HWB
- hwb(305 19% 68%)
- OKLCH
- oklch(0.362 0.066 330.1)
- OKLab
- oklab(0.362 0.058 -0.033)
- CIE Lab
- lab(24.99 19.42 -12.07)
- LCH
- lch(24.99 22.86 328.1)
- CMYK
- cmyk(0% 41% 4% 68%)
Tints · Shades · Tones
Tints
- 61425E
- 72556F
- 836980
- 947D91
- A591A2
- B6A7B4
- C8BCC7
- DAD2D9
- EDE8EC
Shades
- 452843
- 3A2138
- 2F1A2D
- 241323
- 1A0C19
- 10060F
- 070307
- 020102
- 000000
Tones
- 563853
- 5B4058
- 60475D
- 644F62
- 695767
- 6E5F6C
- 726771
- 776F76
- 7B787B
Color harmonies
Complementary +180°
- 51304E
Plum Skin
- 21472A
≈ Zucchini
Analogous -30° +30°
- 51304E
Plum Skin
- 43355B
≈ Jakarta Skyline
- 592E3C
≈ Fig
Triadic +120° +240°
- 51304E
Plum Skin
- 4B3C0C
≈ Xanthophobia
- 004650
≈ Midnight Green
Split-complementary +150° +210°
- 51304E
Plum Skin
- 394217
≈ Ceylanite
- 00483F
≈ Tropical Forest
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 11.15:1 · APCA Lc 96
Ag
FailOn black
WCAG 1.88:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 11.15:1 (AAA) · APCA Lc 96
Contrast pairs
Code snippets
CSS
:root {
--plum-skin: #51304e;
--plum-skin-rgb: 81 48 78;
--plum-skin-oklch: oklch(0.362 0.066 330.1);
}
.element {
color: var(--plum-skin);
background-color: hsl(305 26% 25%);
border-color: oklch(0.362 0.066 330.1);
}Tailwind CSS v4
@theme {
--color-plum-skin: #51304e;
--color-plum-skin-50: #ffeffe;
--color-plum-skin-100: #f6e0f2;
--color-plum-skin-200: #e6cae1;
--color-plum-skin-300: #cdabc7;
--color-plum-skin-400: #b691b1;
--color-plum-skin-500: #a0769b;
--color-plum-skin-600: #876483;
--color-plum-skin-700: #6c5069;
--color-plum-skin-800: #4f3a4e;
--color-plum-skin-900: #372836;
--color-plum-skin-950: #221621;
}SCSS
$plum-skin: #51304e;
$plum-skin-rgb: 81, 48, 78;
$plum-skin-light: mix(#fff, $plum-skin, 20%);
$plum-skin-dark: mix(#000, $plum-skin, 20%);
.element {
color: $plum-skin;
box-shadow: 0 0 0 2px rgba($plum-skin, 0.35);
}