What are the hex codes in the Cheerful Emerald & Mushroom palette?

The Cheerful Emerald & Mushroom color palette consists of Linen #FAEEEF, Mushroom #CFABAD, Emerald #00C089, Licorice #211113.

How should I use the Cheerful Emerald & Mushroom palette on a website?

Use Linen #FAEEEF as the background, Licorice #211113 for text, Emerald #00C089 for buttons and links, and Mushroom #CFABAD for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Linen on Licorice at 16.06:1.

Which colors in Cheerful Emerald & Mushroom have enough contrast for text?

The highest-contrast pair is #FAEEEF on #211113 with a ratio of 16.06:1, which passes WCAG AA for normal text.

#FAEEEFLinen

#CFABADMushroom

#00C089Emerald

#211113Licorice

Cheerful Emerald & Mushroom color palette

Minimal White Green Black

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Linen	`#FAEEEF`	`rgb(250, 238, 239)`	`hsl(355, 55%, 96%)`	`oklch(95.9% 0.013 12)`
Mushroom	`#CFABAD`	`rgb(207, 171, 173)`	`hsl(357, 27%, 74%)`	`oklch(77.4% 0.042 14)`
Emerald	`#00C089`	`rgb(0, 192, 137)`	`hsl(163, 100%, 38%)`	`oklch(71.5% 0.152 164)`
Licorice	`#211113`	`rgb(33, 17, 19)`	`hsl(353, 32%, 10%)`	`oklch(20.1% 0.027 12)`

Why it works and how to use it

Cheerful Emerald & Mushroom is a complementary color palette tagged minimal, white, green. Mushroom and Licorice sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

It works because the lightness range is wide (10% to 96%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.

Background: Linen (#FAEEEF) is the lightest color, so it belongs on large surfaces.
Text: Licorice (#211113) on #FAEEEF gives 16.06:1, passing WCAG AAA.
Primary: Emerald (#00C089) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Mushroom (#CFABAD) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Linen on Licorice at 16.06:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Cheerful Emerald & Mushroom

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

#FAEEEF

#CFABAD

#00C089

#211113

Color-blind check: under protanopia and deuteranopia, Mushroom and Emerald become hard to tell apart, so do not rely on that pair alone to carry meaning.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#FAEEEF` on `#211113`	Aa	16.06:1	AAA
`#CFABAD` on `#211113`	Aa	8.73:1	AAA
`#00C089` on `#211113`	Aa	7.71:1	AAA
`#FAEEEF` on `#00C089`	Aa	2.08:1	Fail
`#FAEEEF` on `#CFABAD`	Aa	1.84:1	Fail
`#CFABAD` on `#00C089`	Aa	1.13:1	Fail

:root {
  --linen: #FAEEEF;
  --mushroom: #CFABAD;
  --emerald: #00C089;
  --licorice: #211113;
}

$linen: #FAEEEF;
$mushroom: #CFABAD;
$emerald: #00C089;
$licorice: #211113;

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'linen': '#FAEEEF',
        'mushroom': '#CFABAD',
        'emerald': '#00C089',
        'licorice': '#211113',
      },
    },
  },
};

{
  "name": "Cheerful Emerald & Mushroom",
  "colors": [
    "#FAEEEF",
    "#CFABAD",
    "#00C089",
    "#211113"
  ]
}

background: linear-gradient(135deg, #FAEEEF, #CFABAD, #00C089, #211113);

Or ask about it in ChatGPT Claude Perplexity

Edit this palette in the generator →

Added 2024-12-18 · Free for commercial use, no attribution needed.

Similar palettes 24 more in this mood