Home Color Palettes 4-Color Distilled Moss Palette

4-Color Distilled Moss Palette

4-color palette · Neutral · Mixed · Triadic harmony

Back to Library

4-Color Distilled Moss Palette

4-color palette · Neutral temperature · Mixed tone · Triadic harmony

Modify

Muted 4 colors Neutral Mixed Triadic

Likes 2,602

Colors 4

CSS variables

:root {
  --c-muted-1: #535238;
  --c-muted-2: #4BBB8B;
  --c-muted-3: #6DDABE;
  --c-muted-4: #C9FFC7;
}

About this palette

This 4-color muted palette runs from Distilled Moss (#C9FFC7) as its lightest tone to Avocado Pear (#535238) as its darkest. It blends Avocado Pear, Aragon Green, Beryl and Distilled Moss into a single set you can drop straight into a UI. Of its 6 color pairings, 2 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #535238 on #C9FFC7 at 7.07:1.

A versatile palette suitable for marketing pages, product hero blocks, illustrations, and accent UI states.

Color breakdown

Avocado Pear #535238

RGB: rgb(83, 82, 56)
HSL: hsl(58, 19%, 27%)
Luminance: 0.082

Aragon Green #4BBB8B

RGB: rgb(75, 187, 139)
HSL: hsl(154, 45%, 51%)
Luminance: 0.389

Beryl #6DDABE

RGB: rgb(109, 218, 190)
HSL: hsl(165, 60%, 64%)
Luminance: 0.571

Distilled Moss #C9FFC7

RGB: rgb(201, 255, 199)
HSL: hsl(118, 100%, 89%)
Luminance: 0.881

Contrast & accessibility

2 of 6 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.

Aa #535238 on #C9FFC7 7.07:1 AAA

Aa #535238 on #6DDABE 4.72:1 AA

Aa #535238 on #4BBB8B 3.34:1 AA Large

Aa #4BBB8B on #C9FFC7 2.12:1 Fail

Aa #6DDABE on #C9FFC7 1.50:1 Fail

Aa #4BBB8B on #6DDABE 1.41:1 Fail

Similar palettes

#EDF1D6 #9DC08B #609966 #40513B

4 colors

#F5F7F8 #F4CE14 #495E57 #45474B

4 colors

#222831 #393E46 #FFD369 #EEEEEE

4 colors

#000000 #52057B #892CDC #BC6FF1

4 colors

#213555 #3E5879 #D8C4B6 #F5EFE7

4 colors

#F5EFE7 #D8C4B6 #4F709C #213555

4 colors

#191A19 #1E5128 #4E9F3D #D8E9A8

4 colors

#352F44 #5C5470 #B9B4C7 #FAF0E6

4 colors