#116A7B
#CDC2AE
#ECE5C7
#C2DEDC
#4B4E4DGraphite
#5D9399Cadet
#A9CDCESilver
#E6D09BOat
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.
Color codes click any value to copy
| Swatch | 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
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 SecondaryCard title
Card title
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.
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
#A88577
#E4C1AB
#FFEFD7
#719080
#8C6A5D
#C6A48E
#E9D8C0
#5C7A6B
#5A5934
#776D5C
#BE957B
#DFACA6
#CAAB80
#B193A4
#A46268
#874A2D
#58737F
#9E8A87
#8EAEC2
#C6B48B
#BBA77C
#CFC2A5
#898A78
#F0EEE6
#624E47
#9E5A58
#D8B493
#FFF9F2
#3D405B
#81B29A
#F2CC8F
#F4F1DE
#5D4037
#8D6E63
#BCAAA4
#EFEBE9
#4B3832
#854442
#BE9B7B
#FFF4E6
#7A5C4A
#B08F73
#E3CDB0
#F8F1E6
#9E6B73
#C99CA2
#E9D5D3
#F7F2EF
#5C302C
#AD9878
#86624B
#F5E7C6
#645762
#777F9B
#888D72
#A0A793
#A1C6CA
#AC976F
#A086A3
#347175
#6D5B3A
#6F658B
#678962
#BAB3E4
#BEC2DE
#A2B98F
#9696AB
#927553
#73684C
#A38580
#829CAF
#B1C2CB
#393A55
#6C708D
#B9ABB7
#FFF9F5
#874658
#A0584E
#94856B
#DCA885
#95605B
#E9D0AC
#C0967C
#FCEEC9
#7F835D
#B8BA8F
#EFE5C4
#FFFAEE
#F7F1F1
#E5CFCF
#C48B8B
#4A3535