Maroon Color Palettes

239 palettes tagged #maroon

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

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

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!