Named color · #3A3B5B
Magic Night
Magic Night is #3A3B5B: rgb(58 59 91), hsl(238 22% 29%), oklch(0.366 0.055 282). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Magic Night color name →
#3A3B5B
oklch(0.366 0.055 282)
Color conversions
- HEX
- #3a3b5b
- RGB
- rgb(58 59 91)
- HSL
- hsl(238 22% 29%)
- HWB
- hwb(238 23% 64%)
- OKLCH
- oklch(0.366 0.055 282)
- OKLab
- oklab(0.366 0.011 -0.054)
- CIE Lab
- lab(25.89 6.19 -19.47)
- LCH
- lch(25.89 20.43 287.6)
- CMYK
- cmyk(36% 35% 0% 64%)
Tints · Shades · Tones
Tints
- 4B4C6A
- 5D5E7A
- 6F718A
- 82849A
- 9698AA
- AAABBB
- BFC0CC
- D4D4DC
- E9EAEE
Shades
- 31324E
- 282941
- 202135
- 181929
- 10111E
- 090913
- 040409
- 010103
- 000000
Tones
- 40425F
- 474863
- 4E4F67
- 55566A
- 5C5D6E
- 636472
- 6A6B75
- 717279
- 79797C
Color harmonies
Complementary +180°
- 3A3B5B
Magic Night
- 44401B
≈ Madras
Analogous -30° +30°
- 3A3B5B
Magic Night
- 29405B
≈ Blue Accolade
- 483654
≈ Purple Plumeria
Triadic +120° +240°
- 3A3B5B
Magic Night
- 573527
≈ Wild Boar
- 214836
≈ Birōdo Green
Split-complementary +150° +210°
- 3A3B5B
Magic Night
- 513A1C
≈ Avocado Stone
- 344526
≈ Ceylanite
Tetradic +90° +180° +270°
- 3A3B5B
Magic Night
- 583237
≈ Mid Century
- 44401B
≈ Madras
- 124846
≈ Cyprus
Contrast & accessibility
Ag
AAAOn white
WCAG 10.73:1 · APCA Lc 95
Ag
FailOn black
WCAG 1.95:1 · APCA Lc 8
Best text color: #FFFFFF
WCAG 10.73:1 (AAA) · APCA Lc 95
Contrast pairs
Code snippets
CSS
:root {
--magic-night: #3a3b5b;
--magic-night-rgb: 58 59 91;
--magic-night-oklch: oklch(0.366 0.055 282);
}
.element {
color: var(--magic-night);
background-color: hsl(238 22% 29%);
border-color: oklch(0.366 0.055 282);
}Tailwind CSS v4
@theme {
--color-magic-night: #3a3b5b;
--color-magic-night-50: #f3f3ff;
--color-magic-night-100: #e5e6fa;
--color-magic-night-200: #d1d2ec;
--color-magic-night-300: #b3b4d3;
--color-magic-night-400: #999bbf;
--color-magic-night-500: #8082aa;
--color-magic-night-600: #6c6e90;
--color-magic-night-700: #565873;
--color-magic-night-800: #3e4055;
--color-magic-night-900: #2b2c3c;
--color-magic-night-950: #181925;
}SCSS
$magic-night: #3a3b5b;
$magic-night-rgb: 58, 59, 91;
$magic-night-light: mix(#fff, $magic-night, 20%);
$magic-night-dark: mix(#000, $magic-night, 20%);
.element {
color: $magic-night;
box-shadow: 0 0 0 2px rgba($magic-night, 0.35);
}