What are the hex codes in the Cherry Mustard & Evergreen palette?

The Cherry Mustard & Evergreen color palette consists of Peacock #006B75, Evergreen #0F5132, Champagne #F5E6C8, Mustard #D4AF37.

How should I use the Cherry Mustard & Evergreen palette on a website?

Use Champagne #F5E6C8 as the background, Evergreen #0F5132 for text, Peacock #006B75 for buttons and links, and Mustard #D4AF37 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Evergreen on Champagne at 7.59:1.

Which colors in Cherry Mustard & Evergreen have enough contrast for text?

The highest-contrast pair is #0F5132 on #F5E6C8 with a ratio of 7.59:1, which passes WCAG AA for normal text.

#006B75Peacock

#0F5132Evergreen

#F5E6C8Champagne

#D4AF37Mustard

Cherry Mustard & Evergreen color palette

Modern Teal Yellow

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Peacock	`#006B75`	`rgb(0, 107, 117)`	`hsl(185, 100%, 23%)`	`oklch(48.2% 0.082 206)`
Evergreen	`#0F5132`	`rgb(15, 81, 50)`	`hsl(152, 69%, 19%)`	`oklch(38.6% 0.083 158)`
Champagne	`#F5E6C8`	`rgb(245, 230, 200)`	`hsl(40, 69%, 87%)`	`oklch(92.9% 0.043 85)`
Mustard	`#D4AF37`	`rgb(212, 175, 55)`	`hsl(46, 65%, 52%)`	`oklch(76.7% 0.139 91)`

Why it works and how to use it

Cherry Mustard & Evergreen is a vivid complementary color palette tagged modern, teal, yellow. Peacock and Mustard sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. These are bold, punchy colors that need generous white space around them. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Peacock takes the lead while the rest support. Lightness runs from 19% to 87%. Well suited to websites, presentations and branding.

Background: Champagne (#F5E6C8) is the lightest color, so it belongs on large surfaces.
Text: Evergreen (#0F5132) on #F5E6C8 gives 7.59:1, passing WCAG AAA.
Primary: Peacock (#006B75) is the most saturated mid-tone; use it for buttons and links (5.07:1 against the background, fine for UI elements).
Accent: Mustard (#D4AF37) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Evergreen on Champagne at 7.59:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Cherry Mustard & Evergreen

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

#006B75

#0F5132

#F5E6C8

#D4AF37

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
`#0F5132` on `#F5E6C8`	Aa	7.59:1	AAA
`#006B75` on `#F5E6C8`	Aa	5.07:1	AA
`#0F5132` on `#D4AF37`	Aa	4.45:1	AA large only
`#006B75` on `#D4AF37`	Aa	2.97:1	Fail
`#F5E6C8` on `#D4AF37`	Aa	1.71:1	Fail
`#006B75` on `#0F5132`	Aa	1.5:1	Fail

:root {
  --peacock: #006B75;
  --evergreen: #0F5132;
  --champagne: #F5E6C8;
  --mustard: #D4AF37;
}

$peacock: #006B75;
$evergreen: #0F5132;
$champagne: #F5E6C8;
$mustard: #D4AF37;

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'peacock': '#006B75',
        'evergreen': '#0F5132',
        'champagne': '#F5E6C8',
        'mustard': '#D4AF37',
      },
    },
  },
};

{
  "name": "Cherry Mustard & Evergreen",
  "colors": [
    "#006B75",
    "#0F5132",
    "#F5E6C8",
    "#D4AF37"
  ]
}

background: linear-gradient(135deg, #006B75, #0F5132, #F5E6C8, #D4AF37);

Or ask about it in ChatGPT Claude Perplexity

Edit this palette in the generator →

Added 2026-01-21 · Free for commercial use, no attribution needed.

Similar palettes 24 more in this mood