Midnight Crimson Monsoon
A warm palette of 6 colors drawing on black, red, orange, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 16.07:1, enough for body text.
About this palette
A warm palette of 6 colors drawing on black, red, orange, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 16.07:1, enough for body text. Open any color for its conversions, shades, harmonies and contrast.
Colors
- ≈ Dwarf Fortress#180502
A very dark, muted brown (Dwarf Fortress) that brings natural comfort. White text sits comfortably on it.
- ≈ Chocolate Castle#41231C
A dark, muted brown (Chocolate Castle) that brings craft and reliability. White text sits comfortably on it.
- ≈ Fire#90422F
A medium, moderately saturated brown (Fire) that brings natural comfort. White text sits comfortably on it.
- ≈ Hemp#A87D6E
A medium, muted red (Hemp) that brings appetite and urgency. Dark text reads well on it.
- ≈ Muddy Rose#E6C1B8
A light, muted pink (Muddy Rose) that brings a warm, expressive tone. Dark text reads well on it.
- ≈ Tutu#F9E3DD
A very light, neutral gray (Tutu) that brings calm restraint. Dark text reads well on it.
Tags
Psychology
Meaning
Applications
Similar palettes
Terracotta Clay
Rosewood Studio
Sand Dune
Mocha Cream
Fig & Honey
Sunset Boulevard
Accessibility
- On white19.78:1Excellent 5/5
- On black17.05:1Excellent 5/5
- Color blind friendly100% similarExcellent 5/5
Contrast is the best any color in the palette reaches on a plain white or black background. Color blind friendly shows how much of the difference between the colors is kept under the common kinds of color blindness.
Colors and suggested roles
| Color | Role | HEX |
|---|---|---|
| Dwarf Fortress | Background | #180502 |
| Chocolate Castle | Surface | #41231C |
| Fire | Primary | #90422F |
| Hemp | Secondary | #A87D6E |
| Muddy Rose | Light | #E6C1B8 |
| Tutu | Paper | #F9E3DD |
CSS variables
:root {
--background: #180502;
--surface: #41231C;
--primary: #90422F;
--secondary: #A87D6E;
--light: #E6C1B8;
--paper: #F9E3DD;
}
Tailwind v4 (@theme)
@theme {
--color-background: #180502;
--color-surface: #41231C;
--color-primary: #90422F;
--color-secondary: #A87D6E;
--color-light: #E6C1B8;
--color-paper: #F9E3DD;
}