Nearest named color · #883363
#883363
Nearest named color: Midnight Aubergine
#883363 (rgb(136 51 99), hsl(326 45% 37%), oklch(0.457 0.128 348.4)) is closest to the named color Midnight Aubergine. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#883363
oklch(0.457 0.128 348.4)
Color conversions
- HEX
- #883363
- RGB
- rgb(136 51 99)
- HSL
- hsl(326 45% 37%)
- HWB
- hwb(326 20% 47%)
- OKLCH
- oklch(0.457 0.128 348.4)
- OKLab
- oklab(0.457 0.126 -0.026)
- CIE Lab
- lab(35.22 40.75 -9.24)
- LCH
- lch(35.22 41.78 347.2)
- CMYK
- cmyk(0% 63% 27% 47%)
Tints · Shades · Tones
Tints
- 954871
- A25C80
- AE6F8F
- BB839E
- C797AE
- D2ABBE
- DEC0CE
- E9D5DE
- F4EAEE
Shades
- 752B55
- 632347
- 521C3A
- 41142E
- 310D21
- 220716
- 13030B
- 060103
- 010000
Tones
- 883C66
- 894569
- 884D6C
- 88546F
- 885C72
- 876374
- 856B77
- 84727A
- 82797D
Color harmonies
Complementary +180°
- 883363
Midnight Aubergine
- 00674E
≈ Peacock Green
Analogous -30° +30°
- 883363
Midnight Aubergine
- 743C84
≈ Amaranth Purple
- 91323A
≈ Wine Cask
Triadic +120° +240°
- 883363
Midnight Aubergine
- 5C5B00
≈ Greensboro
- 00607E
≈ Back of Beyond
Split-complementary +150° +210°
- 883363
Midnight Aubergine
- 2D6714
≈ Keen Green
- 006467
≈ Really Teal
Tetradic +90° +180° +270°
- 883363
Midnight Aubergine
- 734F00
≈ Lucky Brown
- 00674E
≈ Peacock Green
- 25559D
≈ Blue Sail
Contrast & accessibility
Ag
AAAOn white
WCAG 7.77:1 · APCA Lc 86
Ag
FailOn black
WCAG 2.70:1 · APCA Lc 16
Best text color: #FFFFFF
WCAG 7.77:1 (AAA) · APCA Lc 86
Contrast pairs
Code snippets
CSS
:root {
--midnight-aubergine: #883363;
--midnight-aubergine-rgb: 136 51 99;
--midnight-aubergine-oklch: oklch(0.457 0.128 348.4);
}
.element {
color: var(--midnight-aubergine);
background-color: hsl(326 45% 37%);
border-color: oklch(0.457 0.128 348.4);
}Tailwind CSS v4
@theme {
--color-midnight-aubergine: #883363;
--color-midnight-aubergine-50: #ffe7fa;
--color-midnight-aubergine-100: #ffd7ee;
--color-midnight-aubergine-200: #ffbedc;
--color-midnight-aubergine-300: #ea9cc0;
--color-midnight-aubergine-400: #d67eab;
--color-midnight-aubergine-500: #c25f94;
--color-midnight-aubergine-600: #a4517d;
--color-midnight-aubergine-700: #844064;
--color-midnight-aubergine-800: #612e4b;
--color-midnight-aubergine-900: #441f34;
--color-midnight-aubergine-950: #2c0f20;
}SCSS
$midnight-aubergine: #883363;
$midnight-aubergine-rgb: 136, 51, 99;
$midnight-aubergine-light: mix(#fff, $midnight-aubergine, 20%);
$midnight-aubergine-dark: mix(#000, $midnight-aubergine, 20%);
.element {
color: $midnight-aubergine;
box-shadow: 0 0 0 2px rgba($midnight-aubergine, 0.35);
}