warmvibrant
Autumn Leaves Color Palette
Autumn Leaves is a warm and vibrant color palette of 5 colors: Maroon (#6a040f), Dark Red (#9d0208), Crimson (#d00000), Chocolate (#e85d04) and Orange (#faa307). Its dominant hue is red.
The darkest color, Maroon, on the lightest, Orange, gives a 6.29:1 contrast ratio — enough for body text at WCAG AA. 1 pair in this palette passes AA for normal text. Crimson (#d00000) is its most saturated color and a natural choice for buttons and links.
Colors
- Maroon
- Dark Red
- Crimson
- Chocolate
- Orange
CSS Output
:root {
--autumn-leaves-1: #6a040f;
--autumn-leaves-2: #9d0208;
--autumn-leaves-3: #d00000;
--autumn-leaves-4: #e85d04;
--autumn-leaves-5: #faa307;
}Autumn Leaves on a Website
A quick preview on a landing page: the most colorful colors become the primary and accent, a light one the surface. For a more realistic look across many designs, open it in the Palette Visualizer below.
See it on real designs
This is a single preview. The Palette Visualizer shows the palette on 11 designs — dashboards, mobile apps, pricing and blog pages, posters and business cards — lets you change which color plays which role, switch to dark mode and check contrast.
Accessible Color Combinations
Pairs from this palette that work as text on a background, with their WCAG contrast ratio. AA needs 4.5:1 for body text; large text needs 3:1.
- Maroon on Orange#6a040f on #faa3076.29:1AA
- Dark Red on Orange#9d0208 on #faa3074.21:1AA Large
- Maroon on Chocolate#6a040f on #e85d043.66:1AA Large