Maroon
HEX: #800000 | Modern Palette
Color Specifications
#800000
128, 0, 0
0°, 100% ,50%
0, 100, 100, 49.8
About Maroon
Maroon (#800000) is a color with RGB(128, 0, 0) and HSL(0°, 100%, 50.2%). It is commonly associated with Energetic, Bold moods. In design, it fits Vivid, Warm styles and is suitable for Text, Button, Accent. Its complementary color is Teal (#008080), which creates strong contrast. Its triadic palette includes Office Green (#008000) and Navy Blue (#000080). The name comes from marron (French).
- HEX: #800000
- RGB: 128, 0, 0
- HSL: 0°, 100%, 50.2%
- Mood: Energetic, Bold
- Style: Vivid, Warm
- Use case: Text, Button, Accent
- Complementary color: Teal (#008080)
- Triadic colors: Office Green (#008000), Navy Blue (#000080)
- The name comes from marron (French).
Live Components
Color Palettes
Maroon #800000 is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.
Color Harmonies
Maroon #800000 pairs with Teal (#008080) as its complementary color, and Office Green (#008000) and Navy Blue (#000080) in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.
Complementary
The color directly opposite on the color wheel — creates maximum contrast and vibrance.
Triadic
Three colors equally spaced 120° apart — bold, balanced, and visually rich.
Tetradic (Square)
Four colors at 90° intervals — rich variety, best when one color dominates.
Monochromatic
Shades and tints of the same hue — cohesive, elegant, and easy to work with.
Frequently Asked Questions
Name, History & Etymology
History
The word 'marron' in French has roots in Vulgar Latin *marrōnem, which likely came from a pre-Roman substrate language. It originally referred to the sweet chestnut. The adoption into English as a color term is a direct borrowing from French. While the color itself has existed throughout history, its specific naming as 'maroon' in English is relatively recent compared to more basic color terms like 'red' or 'brown'. It gained more widespread recognition as a distinct color name in the 18th and 19th centuries, particularly in fashion and heraldry, to describe a deep, dark red with a brownish tinge.
First Recorded Use
The color 'maroon' as a distinct term in English appears to have been adopted from French, where 'marron' refers to a chestnut. The color of a roasted chestnut is a deep reddish-brown, which aligns with the modern understanding of maroon. Early uses in English often referred to the chestnut itself before the color term became widely established.
Cultural Associations
Maroon is often associated with maturity, sophistication, and seriousness. In many cultures, it can represent passion (due to its red component) but in a more subdued or grounded way than bright red. It is a common color for academic regalia, often signifying a higher level of education or specific disciplines. In sports, maroon is a popular team color for its strong and classic appearance. It can also be found in traditional and formal wear, conveying a sense of elegance and tradition. In some contexts, it might be seen as a more conservative or traditional alternative to brighter reds.
Code Snippets
/* Background */
.element {
background-color: #800000;
}
/* Text */
.element {
color: #800000;
}
/* Border */
.element {
border: 1px solid #800000;
}/* Linear gradient to complementary */
.element {
background: linear-gradient(
to right,
#800000,
#01FFFF
);
}
/* Radial gradient */
.element {
background: radial-gradient(
circle,
#800000,
#01FFFF
);
}// SCSS variable
$maroon: #800000;
// With RGB channels (useful for rgba() usage)
$maroon-r: 128;
$maroon-g: 0;
$maroon-b: 0;
// Usage
.element {
background-color: $maroon;
color: rgba($maroon-r, $maroon-g, $maroon-b, 0.8);
}