Sign Up Sign Up
CC 12

CC 12

12-color palette · Cool · Mixed · Triadic harmony

Back to Library

CC 12

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

Modify
Muted 12 colors Cool Mixed Triadic simple 12color colorful bright
Likes 20
Colors 12

CSS variables

:root {
  --c-muted-1: #5F5652;
  --c-muted-2: #919C8C;
  --c-muted-3: #E4EBF0;
  --c-muted-4: #1E173F;
  --c-muted-5: #7542B7;
  --c-muted-6: #E64DEE;
  --c-muted-7: #1A7194;
  --c-muted-8: #44CA9D;
  --c-muted-9: #A9EB3E;
  --c-muted-10: #C83822;
  --c-muted-11: #E98E51;
  --c-muted-12: #FFFAA7;
}

About this palette

This 12-color muted palette runs from Lemon Slice (#FFFAA7) as its lightest tone to Prune Plum (#1E173F) as its darkest. It blends Timber Brown, Charcoal Tint, Himalaya Peaks, Prune Plum, Purple Rain, Lake Retba Pink, Bateau, Mint Jelly, Dynamic Green, Red Sauce Parlour, Toasted Husk and Lemon Slice into a single set you can drop straight into a UI. Of its 66 color pairings, 16 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #1E173F on #FFFAA7 at 15.59:1.

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

Color breakdown

Timber Brown #5F5652
RGB
rgb(95, 86, 82)
HSL
hsl(18, 7%, 35%)
Luminance
0.097
Charcoal Tint #919C8C
RGB
rgb(145, 156, 140)
HSL
hsl(101, 7%, 58%)
Luminance
0.317
Himalaya Peaks #E4EBF0
RGB
rgb(228, 235, 240)
HSL
hsl(205, 29%, 92%)
Luminance
0.822
Prune Plum #1E173F
RGB
rgb(30, 23, 63)
HSL
hsl(251, 47%, 17%)
Luminance
0.013
Purple Rain #7542B7
RGB
rgb(117, 66, 183)
HSL
hsl(266, 47%, 49%)
Luminance
0.111
Lake Retba Pink #E64DEE
RGB
rgb(230, 77, 238)
HSL
hsl(297, 83%, 62%)
Luminance
0.283
Bateau #1A7194
RGB
rgb(26, 113, 148)
HSL
hsl(197, 70%, 34%)
Luminance
0.142
Mint Jelly #44CA9D
RGB
rgb(68, 202, 157)
HSL
hsl(160, 56%, 53%)
Luminance
0.459
Dynamic Green #A9EB3E
RGB
rgb(169, 235, 62)
HSL
hsl(83, 81%, 58%)
Luminance
0.682
Red Sauce Parlour #C83822
RGB
rgb(200, 56, 34)
HSL
hsl(8, 71%, 46%)
Luminance
0.152
Toasted Husk #E98E51
RGB
rgb(233, 142, 81)
HSL
hsl(24, 78%, 62%)
Luminance
0.373
Lemon Slice #FFFAA7
RGB
rgb(255, 250, 167)
HSL
hsl(57, 100%, 83%)
Luminance
0.924

Contrast & accessibility

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

Aa #1E173F on #FFFAA7 15.59:1 AAA
Aa #E4EBF0 on #1E173F 13.96:1 AAA
Aa #1E173F on #A9EB3E 11.72:1 AAA
Aa #1E173F on #44CA9D 8.15:1 AAA
Aa #1E173F on #E98E51 6.76:1 AA
Aa #5F5652 on #FFFAA7 6.63:1 AA
Aa #7542B7 on #FFFAA7 6.05:1 AA
Aa #5F5652 on #E4EBF0 5.93:1 AA
Aa #919C8C on #1E173F 5.87:1 AA
Aa #E4EBF0 on #7542B7 5.42:1 AA
Aa #1E173F on #E64DEE 5.33:1 AA
Aa #1A7194 on #FFFAA7 5.08:1 AA
Aa #5F5652 on #A9EB3E 4.98:1 AA
Aa #C83822 on #FFFAA7 4.82:1 AA
Aa #E4EBF0 on #1A7194 4.55:1 AA
Aa #7542B7 on #A9EB3E 4.55:1 AA
Aa #E4EBF0 on #C83822 4.31:1 AA Large
Aa #1A7194 on #A9EB3E 3.82:1 AA Large
Aa #A9EB3E on #C83822 3.62:1 AA Large
Aa #5F5652 on #44CA9D 3.46:1 AA Large
Aa #1E173F on #C83822 3.24:1 AA Large
Aa #7542B7 on #44CA9D 3.16:1 AA Large
Aa #1E173F on #1A7194 3.07:1 AA Large
Aa #E64DEE on #FFFAA7 2.93:1 Fail
Aa #5F5652 on #E98E51 2.88:1 Fail
Aa #919C8C on #FFFAA7 2.66:1 Fail
Aa #1A7194 on #44CA9D 2.66:1 Fail
Aa #7542B7 on #E98E51 2.63:1 Fail
Aa #E4EBF0 on #E64DEE 2.62:1 Fail
Aa #1E173F on #7542B7 2.58:1 Fail
Aa #44CA9D on #C83822 2.52:1 Fail
Aa #5F5652 on #919C8C 2.50:1 Fail
Aa #919C8C on #E4EBF0 2.38:1 Fail
Aa #5F5652 on #1E173F 2.35:1 Fail
Aa #E98E51 on #FFFAA7 2.31:1 Fail
Aa #919C8C on #7542B7 2.28:1 Fail
Aa #5F5652 on #E64DEE 2.27:1 Fail
Aa #E64DEE on #A9EB3E 2.20:1 Fail
Aa #1A7194 on #E98E51 2.20:1 Fail
Aa #C83822 on #E98E51 2.09:1 Fail
Aa #7542B7 on #E64DEE 2.07:1 Fail
Aa #E4EBF0 on #E98E51 2.06:1 Fail
Aa #919C8C on #A9EB3E 2.00:1 Fail
Aa #919C8C on #1A7194 1.91:1 Fail
Aa #44CA9D on #FFFAA7 1.91:1 Fail
Aa #919C8C on #C83822 1.81:1 Fail
Aa #E64DEE on #1A7194 1.74:1 Fail
Aa #A9EB3E on #E98E51 1.73:1 Fail
Aa #E4EBF0 on #44CA9D 1.71:1 Fail
Aa #E64DEE on #C83822 1.65:1 Fail
Aa #E64DEE on #44CA9D 1.53:1 Fail
Aa #44CA9D on #A9EB3E 1.44:1 Fail
Aa #919C8C on #44CA9D 1.39:1 Fail
Aa #5F5652 on #C83822 1.38:1 Fail
Aa #A9EB3E on #FFFAA7 1.33:1 Fail
Aa #5F5652 on #1A7194 1.30:1 Fail
Aa #E64DEE on #E98E51 1.27:1 Fail
Aa #7542B7 on #C83822 1.26:1 Fail
Aa #44CA9D on #E98E51 1.20:1 Fail
Aa #E4EBF0 on #A9EB3E 1.19:1 Fail
Aa #7542B7 on #1A7194 1.19:1 Fail
Aa #919C8C on #E98E51 1.15:1 Fail
Aa #E4EBF0 on #FFFAA7 1.12:1 Fail
Aa #5F5652 on #7542B7 1.10:1 Fail
Aa #919C8C on #E64DEE 1.10:1 Fail
Aa #1A7194 on #C83822 1.06: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