What are the hex codes in the Cornflower & Tan Path palette?

The Cornflower & Tan Path color palette consists of Cornflower #88A7F2, Tan #D9C08A, Stone #8A8B6A, Eggshell #F2EEDF.

How should I use the Cornflower & Tan Path palette on a website?

Use Eggshell #F2EEDF as the background, Stone #8A8B6A for text, Cornflower #88A7F2 for buttons and links, and Tan #D9C08A for accents. No pair inside the palette reaches 4.5:1, so add black or white for body text.

Which colors in Cornflower & Tan Path have enough contrast for text?

The highest-contrast pair is #8A8B6A on #F2EEDF with a ratio of 3.02:1, which passes WCAG AA for large text only.

#88A7F2Cornflower

#D9C08ATan

#8A8B6AStone

#F2EEDFEggshell

Cornflower & Tan Path color palette

Modern Blue Beige Gray White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Cornflower	`#88A7F2`	`rgb(136, 167, 242)`	`hsl(222, 80%, 74%)`	`oklch(73.5% 0.115 266)`
Tan	`#D9C08A`	`rgb(217, 192, 138)`	`hsl(41, 51%, 70%)`	`oklch(81.6% 0.076 86)`
Stone	`#8A8B6A`	`rgb(138, 139, 106)`	`hsl(62, 13%, 48%)`	`oklch(62.7% 0.047 109)`
Eggshell	`#F2EEDF`	`rgb(242, 238, 223)`	`hsl(47, 42%, 91%)`	`oklch(94.8% 0.020 95)`

Why it works and how to use it

Cornflower & Tan Path is a complementary color palette tagged modern, blue, beige. Near-complementary hues (about 179° 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, Cornflower takes the lead while the rest support. Lightness runs from 48% to 91%. Well suited to websites, presentations and branding.

Background: Eggshell (#F2EEDF) is the lightest color, so it belongs on large surfaces.
Text: Stone (#8A8B6A) on #F2EEDF gives 3.02:1, enough for large headings only.
Primary: Cornflower (#88A7F2) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Tan (#D9C08A) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

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

BrandFeaturesPricingBlogGet started

Design faster with Cornflower & Tan Path

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

#88A7F2

#D9C08A

#8A8B6A

#F2EEDF

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
`#8A8B6A` on `#F2EEDF`	Aa	3.02:1	AA large only
`#88A7F2` on `#F2EEDF`	Aa	2.04:1	Fail
`#D9C08A` on `#8A8B6A`	Aa	1.98:1	Fail
`#D9C08A` on `#F2EEDF`	Aa	1.52:1	Fail
`#88A7F2` on `#8A8B6A`	Aa	1.48:1	Fail
`#88A7F2` on `#D9C08A`	Aa	1.34:1	Fail

Similar palettes 24 more in this mood