Moody Dark Color Palette
Low-key and atmospheric: deep teal, aubergine, pine, oxblood, and slate navy, all desaturated and dialed down. Rich darks that set a brooding, cinematic mood without going fully black, with just enough hue to stay interesting in shadow. For dramatic posters, moody branding, and night scenes.
Get Paintrix free on the App Store.
Download
Hex codes
Color theory
Base
Complement
Analogous −30°
Analogous +30°
Triadic
Use it for
Code formats
CSS
:root {
--dark-moody-1: #1E4A4A;
--dark-moody-2: #1A4242;
--dark-moody-3: #163A3A;
--dark-moody-4: #123232;
--dark-moody-5: #0F2A2A;
--dark-moody-6: #0B2222;
--dark-moody-7: #3E2A3E;
--dark-moody-8: #382438;
--dark-moody-9: #321F32;
--dark-moody-10: #2C1A2C;
--dark-moody-11: #261526;
--dark-moody-12: #201020;
--dark-moody-13: #25382A;
--dark-moody-14: #203024;
--dark-moody-15: #1B281F;
--dark-moody-16: #162019;
--dark-moody-17: #111814;
--dark-moody-18: #0C100E;
--dark-moody-19: #4A2226;
--dark-moody-20: #421E22;
--dark-moody-21: #3A1A1E;
--dark-moody-22: #32161A;
--dark-moody-23: #2A1216;
--dark-moody-24: #220E12;
--dark-moody-25: #28344A;
--dark-moody-26: #232E42;
--dark-moody-27: #1E283A;
--dark-moody-28: #192232;
--dark-moody-29: #141C2A;
--dark-moody-30: #0F1622;
}SCSS
$dark-moody-1: #1E4A4A;
$dark-moody-2: #1A4242;
$dark-moody-3: #163A3A;
$dark-moody-4: #123232;
$dark-moody-5: #0F2A2A;
$dark-moody-6: #0B2222;
$dark-moody-7: #3E2A3E;
$dark-moody-8: #382438;
$dark-moody-9: #321F32;
$dark-moody-10: #2C1A2C;
$dark-moody-11: #261526;
$dark-moody-12: #201020;
$dark-moody-13: #25382A;
$dark-moody-14: #203024;
$dark-moody-15: #1B281F;
$dark-moody-16: #162019;
$dark-moody-17: #111814;
$dark-moody-18: #0C100E;
$dark-moody-19: #4A2226;
$dark-moody-20: #421E22;
$dark-moody-21: #3A1A1E;
$dark-moody-22: #32161A;
$dark-moody-23: #2A1216;
$dark-moody-24: #220E12;
$dark-moody-25: #28344A;
$dark-moody-26: #232E42;
$dark-moody-27: #1E283A;
$dark-moody-28: #192232;
$dark-moody-29: #141C2A;
$dark-moody-30: #0F1622;Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'dark-moody': {
'1': '#1E4A4A',
'2': '#1A4242',
'3': '#163A3A',
'4': '#123232',
'5': '#0F2A2A',
'6': '#0B2222',
'7': '#3E2A3E',
'8': '#382438',
'9': '#321F32',
'10': '#2C1A2C',
'11': '#261526',
'12': '#201020',
'13': '#25382A',
'14': '#203024',
'15': '#1B281F',
'16': '#162019',
'17': '#111814',
'18': '#0C100E',
'19': '#4A2226',
'20': '#421E22',
'21': '#3A1A1E',
'22': '#32161A',
'23': '#2A1216',
'24': '#220E12',
'25': '#28344A',
'26': '#232E42',
'27': '#1E283A',
'28': '#192232',
'29': '#141C2A',
'30': '#0F1622',
},
},
},
},
};JSON
{
"name": "Moody Dark",
"colors": [
"#1E4A4A",
"#1A4242",
"#163A3A",
"#123232",
"#0F2A2A",
"#0B2222",
"#3E2A3E",
"#382438",
"#321F32",
"#2C1A2C",
"#261526",
"#201020",
"#25382A",
"#203024",
"#1B281F",
"#162019",
"#111814",
"#0C100E",
"#4A2226",
"#421E22",
"#3A1A1E",
"#32161A",
"#2A1216",
"#220E12",
"#28344A",
"#232E42",
"#1E283A",
"#192232",
"#141C2A",
"#0F1622"
]
}Hex list
#1E4A4A
#1A4242
#163A3A
#123232
#0F2A2A
#0B2222
#3E2A3E
#382438
#321F32
#2C1A2C
#261526
#201020
#25382A
#203024
#1B281F
#162019
#111814
#0C100E
#4A2226
#421E22
#3A1A1E
#32161A
#2A1216
#220E12
#28344A
#232E42
#1E283A
#192232
#141C2A
#0F1622