#FFF9F4
#FFE0C7
#81A6FF
#2A2320
#88A7F2Cornflower
#D9C08ATan
#8A8B6AStone
#F2EEDFEggshell
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.
Color codes click any value to copy
| Swatch | 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
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 SecondaryCard title
Card title
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.
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
#5C8D89
#A7D7C5
#F4F9F4
#F2C57C
#EDEEF0
#C9CCD1
#1D4ED8
#0B1220
#FFF8F0
#FFD2CB
#FF819E
#1B3240
#FDFDFF
#FFDFBC
#B9B9B9
#222222
#F8FFFF
#5CB7B8
#FFABBA
#919191
#655B57
#F36893
#C3A7A5
#FFF1E6
#142532
#528494
#DE9D89
#FAF4E9
#FFF8F0
#FFD6A5
#FF8C42
#2B2D42
#121214
#5D6064
#B3CCFF
#E6EEFF
#DCFBFF
#78B9B2
#5A6164
#EEA083
#F7F2EA
#E6DCCB
#CBBBA0
#6B6155
#FFF9F4
#FFE0C7
#F28C38
#2A2320
#F5F7FA
#D9E1EA
#3B6EA5
#1C2733
#FFAF7F
#E0961F
#E3FFFF
#818181
#2469A5
#C97D5A
#E8C9A8
#F8F1E7
#F4F3F1
#B9B6B1
#5F5C58
#438CD2
#F0EEEA
#5A5A5A
#FFCEB7
#B88DCD
#3C3C3C
#747474
#FFB2AA
#EEEEEE
#FFF8F0
#FFD6A5
#00BFFC
#2B2D42
#685F58
#9B907E
#CBD8B6
#EEEFE8
#EDEEF0
#C9CCD1
#006699
#05141E
#BF6664
#293548
#F4F9F2
#E6D59B
#484848
#FFC8AE
#BCABFF
#EEEEEE