Named color · #504358
Blackberry Harvest
Blackberry Harvest is #504358: rgb(80 67 88), hsl(277 14% 30%), oklch(0.404 0.038 312.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Blackberry Harvest color name →
#504358
oklch(0.404 0.038 312.4)
Color conversions
- HEX
- #504358
- RGB
- rgb(80 67 88)
- HSL
- hsl(277 14% 30%)
- HWB
- hwb(277 26% 65%)
- OKLCH
- oklch(0.404 0.038 312.4)
- OKLab
- oklab(0.404 0.026 -0.028)
- CIE Lab
- lab(30.4 9.13 -10.42)
- LCH
- lch(30.4 13.86 311.2)
- CMYK
- cmyk(9% 24% 0% 65%)
Tints · Shades · Tones
Tints
- 605467
- 706577
- 817787
- 928997
- A39CA8
- B5AFB9
- C7C2CA
- D9D6DB
- ECEAED
Shades
- 44394B
- 392F3F
- 2E2633
- 241D28
- 1A141D
- 100C12
- 070509
- 020103
- 000000
Tones
- 55495C
- 594F60
- 5E5564
- 635B68
- 68616C
- 6C6770
- 716D74
- 767378
- 7B7A7C
Color harmonies
Complementary +180°
- 504358
Blackberry Harvest
- 414D38
≈ Hōjicha
Analogous -30° +30°
- 504358
Blackberry Harvest
- 45465D
≈ Darkest Navy
- 58414F
≈ Punchit Purple
Triadic +120° +240°
- 504358
Blackberry Harvest
- 564632
≈ Kuri Black
- 2F504E
≈ Dark Slate Grey
Split-complementary +150° +210°
- 504358
Blackberry Harvest
- 4D4A31
≈ Olive Leaf
- 365043
≈ Highland Green
Tetradic +90° +180° +270°
- 504358
Blackberry Harvest
- 5B4238
≈ Lava Cake
- 414D38
≈ Hōjicha
- 314E58
≈ Seaworthy
Contrast & accessibility
Ag
AAAOn white
WCAG 9.19:1 · APCA Lc 91
Ag
FailOn black
WCAG 2.28:1 · APCA Lc 11
Best text color: #FFFFFF
WCAG 9.19:1 (AAA) · APCA Lc 91
Contrast pairs
Code snippets
CSS
:root {
--blackberry-harvest: #504358;
--blackberry-harvest-rgb: 80 67 88;
--blackberry-harvest-oklch: oklch(0.404 0.038 312.4);
}
.element {
color: var(--blackberry-harvest);
background-color: hsl(277 14% 30%);
border-color: oklch(0.404 0.038 312.4);
}Tailwind CSS v4
@theme {
--color-blackberry-harvest: #504358;
--color-blackberry-harvest-50: #f9f2fd;
--color-blackberry-harvest-100: #ede4f1;
--color-blackberry-harvest-200: #dad0e0;
--color-blackberry-harvest-300: #bfb2c5;
--color-blackberry-harvest-400: #a698af;
--color-blackberry-harvest-500: #8f7f99;
--color-blackberry-harvest-600: #796c81;
--color-blackberry-harvest-700: #615667;
--color-blackberry-harvest-800: #473f4c;
--color-blackberry-harvest-900: #312b35;
--color-blackberry-harvest-950: #1d1920;
}SCSS
$blackberry-harvest: #504358;
$blackberry-harvest-rgb: 80, 67, 88;
$blackberry-harvest-light: mix(#fff, $blackberry-harvest, 20%);
$blackberry-harvest-dark: mix(#000, $blackberry-harvest, 20%);
.element {
color: $blackberry-harvest;
box-shadow: 0 0 0 2px rgba($blackberry-harvest, 0.35);
}