Sign Up Sign Up
Starry 12

Starry 12

12-color palette · Cool · Mixed · Triadic harmony

Back to Library

Starry 12

12-color palette · Cool temperature · Mixed tone · Triadic harmony

Modify
Muted 12 colors Cool Mixed Triadic green blue cool yellow
Likes 50
Colors 12

CSS variables

:root {
  --c-muted-1: #CDD4D0;
  --c-muted-2: #87A2BF;
  --c-muted-3: #2F4F93;
  --c-muted-4: #0E2948;
  --c-muted-5: #85934E;
  --c-muted-6: #5A732B;
  --c-muted-7: #27412D;
  --c-muted-8: #0E1612;
  --c-muted-9: #C4B257;
  --c-muted-10: #BA9511;
  --c-muted-11: #6C392C;
  --c-muted-12: #2B1F12;
}

About this palette

This 12-color muted palette runs from Old Sterling (#CDD4D0) as its lightest tone to Distinctive Lack of Hue (#0E1612) as its darkest. It blends Old Sterling, Windy City, Nightly Activities, Midnight Ocean, Scotland Isle, Loren Forest, English Holly, Distinctive Lack of Hue, Vegas Gold, Faint Gold, Strong Mocha and Coffee Grounds into a single set you can drop straight into a UI. Of its 66 color pairings, 18 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #CDD4D0 on #0E1612 at 12.19:1.

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

Color breakdown

Old Sterling #CDD4D0
RGB
rgb(205, 212, 208)
HSL
hsl(146, 8%, 82%)
Luminance
0.646
Windy City #87A2BF
RGB
rgb(135, 162, 191)
HSL
hsl(211, 30%, 64%)
Luminance
0.348
Nightly Activities #2F4F93
RGB
rgb(47, 79, 147)
HSL
hsl(221, 52%, 38%)
Luminance
0.083
Midnight Ocean #0E2948
RGB
rgb(14, 41, 72)
HSL
hsl(212, 67%, 17%)
Luminance
0.022
Scotland Isle #85934E
RGB
rgb(133, 147, 78)
HSL
hsl(72, 31%, 44%)
Luminance
0.264
Loren Forest #5A732B
RGB
rgb(90, 115, 43)
HSL
hsl(81, 46%, 31%)
Luminance
0.146
English Holly #27412D
RGB
rgb(39, 65, 45)
HSL
hsl(134, 25%, 20%)
Luminance
0.044
Distinctive Lack of Hue #0E1612
RGB
rgb(14, 22, 18)
HSL
hsl(150, 22%, 7%)
Luminance
0.007
Vegas Gold #C4B257
RGB
rgb(196, 178, 87)
HSL
hsl(50, 48%, 55%)
Luminance
0.443
Faint Gold #BA9511
RGB
rgb(186, 149, 17)
HSL
hsl(47, 83%, 40%)
Luminance
0.320
Strong Mocha #6C392C
RGB
rgb(108, 57, 44)
HSL
hsl(12, 42%, 30%)
Luminance
0.063
Coffee Grounds #2B1F12
RGB
rgb(43, 31, 18)
HSL
hsl(31, 41%, 12%)
Luminance
0.015

Contrast & accessibility

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

Aa #CDD4D0 on #0E1612 12.19:1 AAA
Aa #CDD4D0 on #2B1F12 10.65:1 AAA
Aa #CDD4D0 on #0E2948 9.74:1 AAA
Aa #0E1612 on #C4B257 8.63:1 AAA
Aa #C4B257 on #2B1F12 7.54:1 AAA
Aa #CDD4D0 on #27412D 7.41:1 AAA
Aa #87A2BF on #0E1612 6.96:1 AA
Aa #0E2948 on #C4B257 6.89:1 AA
Aa #0E1612 on #BA9511 6.47:1 AA
Aa #CDD4D0 on #6C392C 6.16:1 AA
Aa #87A2BF on #2B1F12 6.08:1 AA
Aa #BA9511 on #2B1F12 5.66:1 AA
Aa #87A2BF on #0E2948 5.56:1 AA
Aa #85934E on #0E1612 5.50:1 AA
Aa #27412D on #C4B257 5.24:1 AA
Aa #CDD4D0 on #2F4F93 5.23:1 AA
Aa #0E2948 on #BA9511 5.17:1 AA
Aa #85934E on #2B1F12 4.80:1 AA
Aa #0E2948 on #85934E 4.39:1 AA Large
Aa #C4B257 on #6C392C 4.36:1 AA Large
Aa #87A2BF on #27412D 4.23:1 AA Large
Aa #27412D on #BA9511 3.93:1 AA Large
Aa #2F4F93 on #C4B257 3.70:1 AA Large
Aa #CDD4D0 on #5A732B 3.55:1 AA Large
Aa #87A2BF on #6C392C 3.52:1 AA Large
Aa #5A732B on #0E1612 3.43:1 AA Large
Aa #85934E on #27412D 3.34:1 AA Large
Aa #BA9511 on #6C392C 3.27:1 AA Large
Aa #5A732B on #2B1F12 3.00:1 AA Large
Aa #87A2BF on #2F4F93 2.99:1 Fail
Aa #2F4F93 on #BA9511 2.78:1 Fail
Aa #85934E on #6C392C 2.78:1 Fail
Aa #0E2948 on #5A732B 2.74:1 Fail
Aa #5A732B on #C4B257 2.51:1 Fail
Aa #2F4F93 on #85934E 2.36:1 Fail
Aa #2F4F93 on #0E1612 2.33:1 Fail
Aa #CDD4D0 on #85934E 2.22:1 Fail
Aa #5A732B on #27412D 2.09:1 Fail
Aa #87A2BF on #5A732B 2.03:1 Fail
Aa #2F4F93 on #2B1F12 2.03:1 Fail
Aa #0E1612 on #6C392C 1.98:1 Fail
Aa #5A732B on #BA9511 1.89:1 Fail
Aa #CDD4D0 on #BA9511 1.88:1 Fail
Aa #2F4F93 on #0E2948 1.86:1 Fail
Aa #CDD4D0 on #87A2BF 1.75:1 Fail
Aa #5A732B on #6C392C 1.74:1 Fail
Aa #6C392C on #2B1F12 1.73:1 Fail
Aa #27412D on #0E1612 1.65:1 Fail
Aa #85934E on #5A732B 1.60:1 Fail
Aa #0E2948 on #6C392C 1.58:1 Fail
Aa #85934E on #C4B257 1.57:1 Fail
Aa #2F4F93 on #5A732B 1.47:1 Fail
Aa #27412D on #2B1F12 1.44:1 Fail
Aa #CDD4D0 on #C4B257 1.41:1 Fail
Aa #2F4F93 on #27412D 1.41:1 Fail
Aa #C4B257 on #BA9511 1.33:1 Fail
Aa #0E2948 on #27412D 1.32:1 Fail
Aa #87A2BF on #85934E 1.27:1 Fail
Aa #0E2948 on #0E1612 1.25:1 Fail
Aa #87A2BF on #C4B257 1.24:1 Fail
Aa #27412D on #6C392C 1.20:1 Fail
Aa #2F4F93 on #6C392C 1.18:1 Fail
Aa #85934E on #BA9511 1.18:1 Fail
Aa #0E1612 on #2B1F12 1.14:1 Fail
Aa #0E2948 on #2B1F12 1.09:1 Fail
Aa #87A2BF on #BA9511 1.08:1 Fail

Similar palettes

#222831 #393E46 #00ADB5 #EEEEEE
4 colors
#F9F7F7 #DBE2EF #3F72AF #112D4E
4 colors
#1B262C #0F4C75 #3282B8 #BBE1FA
4 colors
#08D9D6 #252A34 #FF2E63 #EAEAEA
4 colors
#27374D #526D82 #9DB2BF #DDE6ED
4 colors
#364F6B #3FC1C9 #F5F5F5 #FC5185
4 colors
#E4F9F5 #30E3CA #11999E #40514E
4 colors
#F0F5F9 #C9D6DF #52616B #1E2022
4 colors