What are the hex codes in the Bright Oat & Cadet palette?

The Bright Oat & Cadet color palette consists of Graphite #4B4E4D, Cadet #5D9399, Silver #A9CDCE, Oat #E6D09B.

How should I use the Bright Oat & Cadet palette on a website?

Use Oat #E6D09B as the background, Graphite #4B4E4D for text, Silver #A9CDCE for buttons and links, and Cadet #5D9399 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Graphite on Oat at 5.55:1.

Which colors in Bright Oat & Cadet have enough contrast for text?

The highest-contrast pair is #4B4E4D on #E6D09B with a ratio of 5.55:1, which passes WCAG AA for normal text.

#4B4E4DGraphite

#5D9399Cadet

#A9CDCESilver

#E6D09BOat

Bright Oat & Cadet color palette

Vintage Muted Gray Beige

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Graphite	`#4B4E4D`	`rgb(75, 78, 77)`	`hsl(160, 2%, 30%)`	`oklch(42.1% 0.004 174)`
Cadet	`#5D9399`	`rgb(93, 147, 153)`	`hsl(186, 24%, 48%)`	`oklch(62.8% 0.058 205)`
Silver	`#A9CDCE`	`rgb(169, 205, 206)`	`hsl(182, 27%, 74%)`	`oklch(82.3% 0.038 199)`
Oat	`#E6D09B`	`rgb(230, 208, 155)`	`hsl(42, 60%, 75%)`	`oklch(86.3% 0.073 88)`

Why it works and how to use it

Bright Oat & Cadet is a complementary color palette tagged vintage, muted, gray. Near-complementary hues (about 144° apart) make this a high-contrast, attention-grabbing combination. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.

With 3 chromatic colors, Silver takes the lead while the rest support. Lightness runs from 30% to 75%. Well suited to websites, presentations and branding.

Background: Oat (#E6D09B) is the lightest color, so it belongs on large surfaces.
Text: Graphite (#4B4E4D) on #E6D09B gives 5.55:1, passing WCAG AA.
Primary: Silver (#A9CDCE) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Cadet (#5D9399) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Graphite on Oat at 5.55:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Bright Oat & Cadet

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

#4B4E4D

#5D9399

#A9CDCE

#E6D09B

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
`#4B4E4D` on `#E6D09B`	Aa	5.55:1	AA
`#4B4E4D` on `#A9CDCE`	Aa	4.93:1	AA
`#4B4E4D` on `#5D9399`	Aa	2.44:1	Fail
`#5D9399` on `#E6D09B`	Aa	2.27:1	Fail
`#5D9399` on `#A9CDCE`	Aa	2.02:1	Fail
`#A9CDCE` on `#E6D09B`	Aa	1.13:1	Fail

Similar palettes 24 more in this mood