Maroon Color Palettes

237 palettes tagged #maroon

Deep, sophisticated maroon and burgundy palettes with a rich, vintage feel.

See what colors go with Maroon Maroon aesthetic
Related: #cool #web #energetic #sunset #fashion #earth #branding #autumn #sky #vibrant #playful #romantic #print #ui #soft #illustration #gradient #muted #calm #winter #melancholy #mysterious #spring #jewel-tones #photography #orange #bold
Showing 60 of 237

Maroon color in CSS

The maroon reference values and ready-to-paste CSS variables. Click any value to copy it.

:root {
  --maroon-50: #EFD9D9;
  --maroon-200: #C97A7A;
  --maroon-400: #A03333;
  --maroon-600: #6A1B1B;
  --maroon-800: #3E0A0A;
}

Prefer Tailwind? Drop these hex codes into the colors key of your tailwind.config.js, or copy any palette above as a full Tailwind config.

About Maroon Color Palettes

What does maroon represent in design?

Maroon is a brownish-red that feels grounded, refined and confident. It carries red's warmth but reads as mature and elegant — popular with wine, fashion and editorial brands.

Popular maroon shades & how to use them

Maroon palettes often build on shades like #EFD9D9, #C97A7A, #A03333, #6A1B1B, #3E0A0A. Click any palette above to copy its hex codes, CSS, or Tailwind values straight into your project — combine lighter tints for backgrounds with deeper tones for text and accents.

Copied!