What are the hex codes in the Classic Chestnut & Sage palette?

The Classic Chestnut & Sage color palette consists of Onyx #2C3F36, Sage #7CAD93, Frost #EDF3F1, Chestnut #A5505B.

How should I use the Classic Chestnut & Sage palette on a website?

Use Frost #EDF3F1 as the background, Onyx #2C3F36 for text, Chestnut #A5505B for buttons and links, and Sage #7CAD93 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Onyx on Frost at 9.99:1.

Which colors in Classic Chestnut & Sage have enough contrast for text?

The highest-contrast pair is #2C3F36 on #EDF3F1 with a ratio of 9.99:1, which passes WCAG AA for normal text.

#2C3F36Onyx

#7CAD93Sage

#EDF3F1Frost

#A5505BChestnut

Classic Chestnut & Sage color palette

Modern Gray White Brown

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Onyx	`#2C3F36`	`rgb(44, 63, 54)`	`hsl(152, 18%, 21%)`	`oklch(34.8% 0.029 164)`
Sage	`#7CAD93`	`rgb(124, 173, 147)`	`hsl(148, 23%, 58%)`	`oklch(70.5% 0.065 161)`
Frost	`#EDF3F1`	`rgb(237, 243, 241)`	`hsl(160, 20%, 94%)`	`oklch(95.9% 0.007 174)`
Chestnut	`#A5505B`	`rgb(165, 80, 91)`	`hsl(352, 35%, 48%)`	`oklch(53.9% 0.112 14)`

Why it works and how to use it

Classic Chestnut & Sage is a complementary color palette tagged modern, gray, white. Onyx and Chestnut sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Chestnut takes the lead while the rest support. Lightness runs from 21% to 94%. Well suited to websites, presentations and branding.

Background: Frost (#EDF3F1) is the lightest color, so it belongs on large surfaces.
Text: Onyx (#2C3F36) on #EDF3F1 gives 9.99:1, passing WCAG AAA.
Primary: Chestnut (#A5505B) is the most saturated mid-tone; use it for buttons and links (4.79:1 against the background, fine for UI elements).
Accent: Sage (#7CAD93) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Onyx on Frost at 9.99:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Classic Chestnut & Sage

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#2C3F36

#7CAD93

#EDF3F1

#A5505B

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#2C3F36` on `#EDF3F1`	Aa	9.99:1	AAA
`#EDF3F1` on `#A5505B`	Aa	4.79:1	AA
`#2C3F36` on `#7CAD93`	Aa	4.41:1	AA large only
`#7CAD93` on `#EDF3F1`	Aa	2.26:1	Fail
`#7CAD93` on `#A5505B`	Aa	2.12:1	Fail
`#2C3F36` on `#A5505B`	Aa	2.08:1	Fail

Similar palettes 24 more in this mood