#C9A66B
#E4C590
#F1E3C8
#F9F5EC
#F4F1DEBeige
#DDD590Oat
#77B2ACDusty Blue
#D6853ABronze
Bold Bronze & Oat is a complementary color palette tagged pastel, white, beige. Near-complementary hues (about 145° 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 |
|---|---|---|---|---|---|
| Beige | #F4F1DE | rgb(244, 241, 222) | hsl(52, 50%, 91%) | oklch(95.5% 0.025 100) | |
| Oat | #DDD590 | rgb(221, 213, 144) | hsl(54, 53%, 72%) | oklch(86.4% 0.089 102) | |
| Dusty Blue | #77B2AC | rgb(119, 178, 172) | hsl(174, 28%, 58%) | oklch(72.1% 0.062 188) | |
| Bronze | #D6853A | rgb(214, 133, 58) | hsl(29, 66%, 53%) | oklch(68.9% 0.133 60) |
Why it works and how to use it
It works because the lightness steps are gentle (53% to 91%), which keeps the mood consistent from edge to edge. Try it for websites, presentations and branding.
- Background: Beige (#F4F1DE) is the lightest color, so it belongs on large surfaces.
- Text: Bronze (#D6853A) on #F4F1DE gives 2.54:1, so pair it with a darker neutral for body copy.
- Primary: Oat (#DDD590) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Dusty Blue (#77B2AC) 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 Bold Bronze & Oat
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
#F4F1DE
#DDD590
#77B2AC
#D6853A
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#F4F1DE on #D6853A | Aa | 2.54:1 | Fail |
#F4F1DE on #77B2AC | Aa | 2.11:1 | Fail |
#DDD590 on #D6853A | Aa | 1.92:1 | Fail |
#DDD590 on #77B2AC | Aa | 1.6:1 | Fail |
#F4F1DE on #DDD590 | Aa | 1.32:1 | Fail |
#77B2AC on #D6853A | Aa | 1.2:1 | Fail |
Similar palettes 24 more in this mood
#D98C6B
#EFC1A2
#B5A78F
#F8F2EA
#C2A167
#D292A5
#D9B2AD
#FFEDE2
#DD9F6E
#EDD693
#9DBE7C
#FDFDFD
#EDD693
#DE9F7B
#82C3AF
#FDFDFD
#D9A48F
#EFC8B8
#F7E6DC
#FFFAF6
#FF9A8B
#FFB4A2
#FFCDB2
#FFF1E6
#FFBE98
#F9A98D
#F8D5C2
#FFF4EC
#FFA891
#F7C6B5
#FBEDE7
#F0BC7A
#F6B078
#F0CBAA
#FBEDE7
#DAC777
#D4DDC2
#A7D9A4
#C5BF9C
#B59A71
#C1D7C4
#BBF0F9
#E5F1BF
#F0FBF8
#FBF6F0
#F3DCD4
#E8B4B8
#B8A184
#A2A285
#CE8F73
#E7C4A3
#FFE9B9
#D2C6AC
#FFC6DB
#FFCFAF
#FFE5E2
#FDE7D9
#F5D0B8
#E8B598
#C68F6D
#62D8CB
#F7C6B5
#FBEDE7
#F0BC7A
#DD9A84
#C2BB86
#ECD0B1
#FFDFE4
#BE9D76
#86B09B
#CCC596
#D9E2D3
#FFF8F7
#FFD6CD
#FAB9AB
#CD8A7D
#D69F74
#C5D9A6
#E5DCCD
#F8F1AF
#A99F74
#D0C28A
#F4D891
#FFF3AC
#9E9B8A
#C39F63
#ADE0C7
#FFEBE6
#D198A5
#E0B289
#CDBAC8
#FFEBE6