Maroon is a dark brownish red. The CSS keyword maroon is exactly #800000 — pure red at 0° hue held at 25% lightness, with nothing else added. Grab the HEX codes from a scheme below, or build a custom maroon palette around any base colour with the generator.
Deep Maroon holds 0° hue at every step, from #2B0A0A to #A31212, so it is red purely by lightness. Maroon & Rose lifts the top end into dusty pink with #D6A2AD and #EFD9DA. Warm Maroon is the softest, dropping to 42% saturation for a more muted, brick-like set.
#2B0A0A#4A0E0E#6B1010#800000#A31212#5C0016#800000#B23A48#D6A2AD#EFD9DA#3E0703#7B2020#A63A3A#C97B7B#E8C7C7Anchored to a maroon base — press Space or Generate to roll more schemes. Click a swatch to copy its HEX, lock one to keep it while the rest re-roll, then export as CSS, JSON or HEX.
Drag in the colour area or the hue bar, or type a HEX / RGB value, then build a scheme anchored to it.
Maroon is dark and warm, and close enough to brown to sit against natural materials — cream, tan and gold all work, while a deep green gives it the only real contrast on the wheel. It has a strong academic association, which is why dark academia palettes reach for it. Sports kits, university branding and autumn campaigns use it most.
:root block with each colour as a custom property (--color-1, --color-2 and so on), or copy a single HEX straight from any swatch above. On a narrow phone the generator shows four swatches instead of five, so the block you copy there carries four custom properties. Whatever the width, it rolls around #800000, the maroon this page is seeded with, so the export stays on-hue. Copy JSON and Copy HEX give the same values as an array and as a comma-separated line.More palettes: Burgundy palette · Rust palette · Red palette · all colours