Charcoal#2F3E46
Dark Slate Gray#354F52
Dim Gray#52796F
Dark Sea Green#84A98C
Light Gray#CAD2C5

Color Palette

#2F3E46 · #354F52 · #52796F · #84A98C · #CAD2C5

monochromatic0 likes
Share

Export for Developers

:root {
  --color-1: #2F3E46;
  --color-1-rgb: 47, 62, 70;
  --color-1-hsl: 201, 20%, 23%;
  --color-2: #354F52;
  --color-2-rgb: 53, 79, 82;
  --color-2-hsl: 186, 21%, 26%;
  --color-3: #52796F;
  --color-3-rgb: 82, 121, 111;
  --color-3-hsl: 165, 19%, 40%;
  --color-4: #84A98C;
  --color-4-rgb: 132, 169, 140;
  --color-4-hsl: 133, 18%, 59%;
  --color-5: #CAD2C5;
  --color-5-rgb: 202, 210, 197;
  --color-5-hsl: 97, 13%, 80%;
}

Real World Preview

Get Started

Accessibility

WCAG Accessibility Report

Excellent
#2F3E46
On White
11.06:1AAA
On Black
1.9:1Fail
Aa
Aa
#354F52
On White
8.78:1AAA
On Black
2.39:1Fail
Aa
Aa
#52796F
On White
4.86:1AA
On Black
4.32:1Fail
Aa
Aa
#84A98C
On White
2.61:1Fail
On Black
8.03:1AAA
Aa
Aa
#CAD2C5
On White
1.55:1Fail
On Black
13.54:1AAA
Aa
Aa

Contrast ratios calculated per WCAG 2.1. AA requires ≥4.5:1, AAA requires ≥7:1 for normal text.

Palette Variations

Palette Variations

Original

☀️

lighter

· Increased lightness, reduced saturation

🌑

darker

· Reduced lightness, increased saturation

🌫️

muted

· Desaturated for a calm, muted look

vibrant

· Boosted saturation for maximum impact