Home Color Palettes 4-Color Salem Palette

4-Color Salem Palette

4-color palette · Neutral · Dark · Analogous harmony

Back to Library

4-Color Salem Palette

4-color palette · Neutral temperature · Dark tone · Analogous harmony

Modify

Muted 4 colors Neutral Dark Analogous

Likes 6,251

Colors 4

CSS variables

:root {
  --c-muted-1: #18230F;
  --c-muted-2: #27391C;
  --c-muted-3: #255F38;
  --c-muted-4: #1F7D53;
}

About this palette

This 4-color muted palette runs from Salem (#1F7D53) as its lightest tone to Midnight Pines (#18230F) as its darkest. It blends Midnight Pines, Mountain Range Green, Derbyshire and Salem into a single set you can drop straight into a UI. None of the 6 in-palette color pairings clear the WCAG AA contrast threshold (4.5:1), so pair these colors with black or white for body text.

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

Color breakdown

Midnight Pines #18230F

RGB: rgb(24, 35, 15)
HSL: hsl(93, 40%, 10%)
Luminance: 0.014

Mountain Range Green #27391C

RGB: rgb(39, 57, 28)
HSL: hsl(97, 34%, 17%)
Luminance: 0.034

Derbyshire #255F38

RGB: rgb(37, 95, 56)
HSL: hsl(140, 44%, 26%)
Luminance: 0.089

Salem #1F7D53

RGB: rgb(31, 125, 83)
HSL: hsl(153, 60%, 31%)
Luminance: 0.156

Contrast & accessibility

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

Aa #18230F on #1F7D53 3.20:1 AA Large

Aa #27391C on #1F7D53 2.44:1 Fail

Aa #18230F on #255F38 2.16:1 Fail

Aa #27391C on #255F38 1.64:1 Fail

Aa #255F38 on #1F7D53 1.48:1 Fail

Aa #18230F on #27391C 1.31:1 Fail

Similar palettes

#000000 #3E065F #700B97 #8E05C2

4 colors

#000000 #150050 #3F0071 #FB2576

4 colors

#000000 #3E432E #616F39 #A7D129

4 colors

#4B5D67 #322F3D #59405C #87556F

4 colors

#FF5200 #6F0000 #00263B #00A1AB

4 colors

#000000 #0F6292 #16FF00 #FFED00

4 colors

#251D3A #2A2550 #E04D01 #FF7700

4 colors

#FFA900 #9D8221 #014441 #01252A

4 colors