Sign Up Sign Up
Windswept

Windswept

10-color palette · Cool · Dark · Monochromatic harmony

Back to Library

Windswept

10-color palette · Cool temperature · Dark tone · Monochromatic harmony

Modify
Muted 10 colors Cool Dark Monochromatic green dark blue cold
Likes 56
Colors 10

CSS variables

:root {
  --c-muted-1: #101211;
  --c-muted-2: #171B1C;
  --c-muted-3: #1D2621;
  --c-muted-4: #242B33;
  --c-muted-5: #2F353A;
  --c-muted-6: #2F4349;
  --c-muted-7: #424F53;
  --c-muted-8: #4E615C;
  --c-muted-9: #5F6E62;
  --c-muted-10: #657C6E;
}

About this palette

This 10-color muted palette runs from Atlas Cedar Green (#657C6E) as its lightest tone to Dreamless Sleep (#101211) as its darkest. It blends Dreamless Sleep, Gluon Grey, Shadow Warrior, Sky Captain, Inkwell, Little Mermaid, Lunar Eclipse, Vert Pierre, Windrock and Atlas Cedar Green into a single set you can drop straight into a UI. None of the 45 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

Dreamless Sleep #101211
RGB
rgb(16, 18, 17)
HSL
hsl(150, 6%, 7%)
Luminance
0.006
Gluon Grey #171B1C
RGB
rgb(23, 27, 28)
HSL
hsl(192, 10%, 10%)
Luminance
0.011
Shadow Warrior #1D2621
RGB
rgb(29, 38, 33)
HSL
hsl(147, 13%, 13%)
Luminance
0.018
Sky Captain #242B33
RGB
rgb(36, 43, 51)
HSL
hsl(212, 17%, 17%)
Luminance
0.023
Inkwell #2F353A
RGB
rgb(47, 53, 58)
HSL
hsl(207, 10%, 21%)
Luminance
0.035
Little Mermaid #2F4349
RGB
rgb(47, 67, 73)
HSL
hsl(194, 22%, 24%)
Luminance
0.051
Lunar Eclipse #424F53
RGB
rgb(66, 79, 83)
HSL
hsl(194, 11%, 29%)
Luminance
0.074
Vert Pierre #4E615C
RGB
rgb(78, 97, 92)
HSL
hsl(164, 11%, 34%)
Luminance
0.109
Windrock #5F6E62
RGB
rgb(95, 110, 98)
HSL
hsl(132, 7%, 40%)
Luminance
0.145
Atlas Cedar Green #657C6E
RGB
rgb(101, 124, 110)
HSL
hsl(143, 10%, 44%)
Luminance
0.183

Contrast & accessibility

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

Aa #101211 on #657C6E 4.17:1 AA Large
Aa #171B1C on #657C6E 3.85:1 AA Large
Aa #101211 on #5F6E62 3.49:1 AA Large
Aa #1D2621 on #657C6E 3.45:1 AA Large
Aa #171B1C on #5F6E62 3.22:1 AA Large
Aa #242B33 on #657C6E 3.17:1 AA Large
Aa #1D2621 on #5F6E62 2.88:1 Fail
Aa #101211 on #4E615C 2.86:1 Fail
Aa #2F353A on #657C6E 2.76:1 Fail
Aa #242B33 on #5F6E62 2.65:1 Fail
Aa #171B1C on #4E615C 2.64:1 Fail
Aa #1D2621 on #4E615C 2.36:1 Fail
Aa #2F4349 on #657C6E 2.31:1 Fail
Aa #2F353A on #5F6E62 2.30:1 Fail
Aa #101211 on #424F53 2.22:1 Fail
Aa #242B33 on #4E615C 2.17:1 Fail
Aa #171B1C on #424F53 2.05:1 Fail
Aa #2F4349 on #5F6E62 1.93:1 Fail
Aa #2F353A on #4E615C 1.89:1 Fail
Aa #424F53 on #657C6E 1.88:1 Fail
Aa #1D2621 on #424F53 1.83:1 Fail
Aa #101211 on #2F4349 1.81:1 Fail
Aa #242B33 on #424F53 1.69:1 Fail
Aa #171B1C on #2F4349 1.67:1 Fail
Aa #2F4349 on #4E615C 1.58:1 Fail
Aa #424F53 on #5F6E62 1.57:1 Fail
Aa #101211 on #2F353A 1.51:1 Fail
Aa #1D2621 on #2F4349 1.49:1 Fail
Aa #2F353A on #424F53 1.46:1 Fail
Aa #4E615C on #657C6E 1.46:1 Fail
Aa #171B1C on #2F353A 1.40:1 Fail
Aa #242B33 on #2F4349 1.38:1 Fail
Aa #101211 on #242B33 1.31:1 Fail
Aa #424F53 on #4E615C 1.29:1 Fail
Aa #1D2621 on #2F353A 1.25:1 Fail
Aa #2F4349 on #424F53 1.23:1 Fail
Aa #4E615C on #5F6E62 1.22:1 Fail
Aa #101211 on #1D2621 1.21:1 Fail
Aa #171B1C on #242B33 1.21:1 Fail
Aa #5F6E62 on #657C6E 1.20:1 Fail
Aa #2F353A on #2F4349 1.19:1 Fail
Aa #242B33 on #2F353A 1.15:1 Fail
Aa #171B1C on #1D2621 1.12:1 Fail
Aa #1D2621 on #242B33 1.09:1 Fail
Aa #101211 on #171B1C 1.08:1 Fail

Similar palettes

#212121 #323232 #0D7377 #14FFEC
4 colors
#0A2647 #144272 #205295 #2C74B3
4 colors
#040D12 #183D3D #5C8374 #93B1A6
4 colors
#142850 #27496D #0C7B93 #00A8CC
4 colors
#635985 #443C68 #393053 #18122B
4 colors
#000000 #150050 #3F0071 #610094
4 colors
#151515 #301B3F #3C415C #B4A5A5
4 colors
#041C32 #04293A #064663 #ECB365
4 colors