Named color · #880044
Midnight Merlot
Midnight Merlot is #880044: rgb(136 0 68), hsl(330 100% 27%), oklch(0.405 0.164 0.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Midnight Merlot color name →
#880044
oklch(0.405 0.164 0.9)
Color conversions
- HEX
- #880044
- RGB
- rgb(136 0 68)
- HSL
- hsl(330 100% 27%)
- HWB
- hwb(330 0% 47%)
- OKLCH
- oklch(0.405 0.164 0.9)
- OKLab
- oklab(0.405 0.164 0.003)
- CIE Lab
- lab(28.97 52.7 1.86)
- LCH
- lch(28.97 52.74 2)
- CMYK
- cmyk(0% 100% 50% 47%)
Tints · Shades · Tones
Tints
- 972A55
- A44466
- B25C77
- BE738A
- CA8A9C
- D6A1AF
- E1B8C3
- ECCFD6
- F6E7EB
Shades
- 75003A
- 630030
- 520026
- 41001D
- 310014
- 22000C
- 130005
- 060002
- 010000
Tones
- 891C4A
- 8A2C4F
- 8B3955
- 8B455B
- 8A4F61
- 895967
- 88636D
- 866D73
- 83777A
Color harmonies
Complementary +180°
- 880044
Midnight Merlot
- 00564B
≈ Castleton Green
Analogous -30° +30°
- 880044
Midnight Merlot
- 771671
≈ Pure Purple
- 8B0E00
≈ Roasted Pepper
Triadic +120° +240°
- 880044
Midnight Merlot
- 425000
≈ No Emissions Green
- 004E77
≈ Blue Meridian
Split-complementary +150° +210°
- 880044
Midnight Merlot
- 005928
≈ Caliban Green
- 00535F
≈ Sandalwood Grey Blue
Tetradic +90° +180° +270°
- 880044
Midnight Merlot
- 5A4700
≈ Sugarloaf Brown
- 00564B
≈ Castleton Green
- 2C3AA0
≈ Liquid Denim
Contrast & accessibility
Ag
AAAOn white
WCAG 9.85:1 · APCA Lc 91
Ag
FailOn black
WCAG 2.13:1 · APCA Lc 12
Best text color: #FFFFFF
WCAG 9.85:1 (AAA) · APCA Lc 91
Contrast pairs
Code snippets
CSS
:root {
--midnight-merlot: #880044;
--midnight-merlot-rgb: 136 0 68;
--midnight-merlot-oklch: oklch(0.405 0.164 0.9);
}
.element {
color: var(--midnight-merlot);
background-color: hsl(330 100% 27%);
border-color: oklch(0.405 0.164 0.9);
}Tailwind CSS v4
@theme {
--color-midnight-merlot: #880044;
--color-midnight-merlot-50: #ffe2f1;
--color-midnight-merlot-100: #ffd2e3;
--color-midnight-merlot-200: #ffb7cd;
--color-midnight-merlot-300: #fc92af;
--color-midnight-merlot-400: #ea7099;
--color-midnight-merlot-500: #d84c80;
--color-midnight-merlot-600: #b6416c;
--color-midnight-merlot-700: #923457;
--color-midnight-merlot-800: #6d2541;
--color-midnight-merlot-900: #4d182d;
--color-midnight-merlot-950: #32081a;
}SCSS
$midnight-merlot: #880044;
$midnight-merlot-rgb: 136, 0, 68;
$midnight-merlot-light: mix(#fff, $midnight-merlot, 20%);
$midnight-merlot-dark: mix(#000, $midnight-merlot, 20%);
.element {
color: $midnight-merlot;
box-shadow: 0 0 0 2px rgba($midnight-merlot, 0.35);
}