What Color Is Maroon?
Maroon is a dark brownish red. Learn its standard web value, how it differs from burgundy and crimson, and how to specify it in a vector logo palette.
Contents
Maroon is a dark red with a brownish cast, deeper and more muted than a true red. Its name comes from the French word marron, meaning chestnut, which explains the brown undertone that sets it apart from brighter reds. In digital design the most widely referenced definition is the CSS and HTML named color maroon, which equals hex #800000, or RGB 128, 0, 0. That is pure red at half intensity, with no green or blue.
The Standard Values for Maroon
When a style sheet, web color picker or design tool lists "maroon" as a named color, it usually means the CSS value below. The figures follow directly from that definition.
| Model | Value for CSS maroon |
| Hex | #800000 |
| RGB | 128, 0, 0 |
| HSL | 0°, 100%, 25% |
There is no single universal maroon. The older X11 color list, which some software inherited, defines maroon as #B03060, a lighter, pinker shade. Brands, sports teams and universities also publish their own "maroon" that can differ noticeably from both. If you are matching an existing organization's color, use its published specification rather than a generic named value. No organization-specific values were supplied for this article.
How Maroon Differs From Similar Colors
Maroon sits among several dark reds that are often confused. The descriptions below are general color-naming conventions. Exact boundaries vary between sources, so treat them as orientation rather than strict definitions.
- Maroon: dark red leaning toward brown, with low brightness and little or no blue.
- Burgundy: dark red leaning toward purple, so it carries a slight blue component that maroon lacks.
- Crimson: a brighter, more saturated red with a faint blue lean; much lighter than maroon.
- Oxblood: a very dark red-brown, often described as darker and more leathery than maroon.
- Brick red: an orange-leaning, earthy red that is lighter and warmer than maroon.
What Makes Maroon Look the Way It Does
In additive screen color, maroon is produced by running only the red channel at moderate strength. The low brightness pushes the red toward a brownish, subdued appearance, because the eye reads dim, warm reds as earthier than saturated ones. Adding a small amount of blue drifts the color toward burgundy. Adding green or raising brightness moves it toward brick or true red. This is why two colors both labeled maroon can look different. Small changes in channel balance shift the undertone.
Specifying Maroon in a Vector Logo Palette
A logo palette needs maroon defined for each output, not just named. A practical specification usually includes:
- A hex or RGB value for screens, websites and digital files.
- A CMYK build for process printing, created with the color profile your printer actually uses.
- A spot color reference, if the logo will be printed with matched inks; choose it by viewing a physical swatch guide, not a monitor.
- Notes on which version applies to which medium, so the screen and print values are not swapped.
Converting #800000 to CMYK does not produce one fixed answer. The result depends on the color profile and the paper, and dark reds are a range where screen and print often disagree. That is why this article gives no CMYK or spot equivalent. Any figure would need to come from your print workflow or a physical swatch.
Checking That Maroon Is Applied to Real Vector Artwork
In a file such as AI, EPS, PDF or SVG, the maroon should be a fill or stroke on vector paths. Ideally it is stored as a named or global swatch, so a single edit updates every instance. Three checks matter:
- Confirm the shapes are editable paths. A file extension alone does not guarantee this, because vector formats can contain embedded raster images.
- If the maroon area is an embedded bitmap, its color cannot be changed cleanly as a swatch. It will also degrade when scaled. Rebuild or trace that element as vector paths.
- Do not take color values from a PNG or JPG preview. Raster exports can shift color through compression and color-profile handling, so sample the swatch in the source file instead.
Practical Considerations for Using Maroon in a Logo
CSS maroon has high contrast against white. It comfortably exceeds the commonly used 4.5:1 accessibility threshold for normal text, so it reads well on light backgrounds. Against black or other dark backgrounds the contrast is poor. Plan a reversed version of the logo in white or a light tint for dark placements. A one-color black version is also useful for single-color reproduction.
As an editorial suggestion rather than a rule, maroon is often paired with cream, warm gray, gold or white. These combinations keep the palette warm without competing with the red. If you generate tints and shades for a wider palette, derive them from the same base value. That keeps them consistent and keeps the undertone from drifting toward burgundy or brick.
Finally, a color value itself is generally not restricted, but an organization's logo artwork, fonts and trademarks are. Being able to download a logo that uses maroon does not grant permission to modify it or reuse its design elements.