Sign Up Sign Up
Merry 12

Merry 12

12-color palette · Cool · Mixed · Triadic harmony

Back to Library

Merry 12

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

Modify
Muted 12 colors Cool Mixed Triadic gray green white red
Likes 31
Colors 12

CSS variables

:root {
  --c-muted-1: #1B1F1D;
  --c-muted-2: #2E3A43;
  --c-muted-3: #5A7880;
  --c-muted-4: #9DB9C6;
  --c-muted-5: #F2F2F2;
  --c-muted-6: #A8ED77;
  --c-muted-7: #5FBC62;
  --c-muted-8: #326D42;
  --c-muted-9: #E2CB7C;
  --c-muted-10: #CF7E53;
  --c-muted-11: #932443;
  --c-muted-12: #493127;
}

About this palette

This 12-color muted palette runs from Bleached Silk (#F2F2F2) as its lightest tone to Satin Deep Black (#1B1F1D) as its darkest. It blends Satin Deep Black, Precision, Hampton Surf, Déjà Blue, Bleached Silk, Lima, Lawn Party, Genever Green, Blossom Yellow, Apricot Buff, Berry Rossi and Rojo Marrón into a single set you can drop straight into a UI. Of its 66 color pairings, 20 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #1B1F1D on #F2F2F2 at 14.88:1.

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

Color breakdown

Satin Deep Black #1B1F1D
RGB
rgb(27, 31, 29)
HSL
hsl(150, 7%, 11%)
Luminance
0.013
Precision #2E3A43
RGB
rgb(46, 58, 67)
HSL
hsl(206, 19%, 22%)
Luminance
0.040
Hampton Surf #5A7880
RGB
rgb(90, 120, 128)
HSL
hsl(193, 17%, 43%)
Luminance
0.172
Déjà Blue #9DB9C6
RGB
rgb(157, 185, 198)
HSL
hsl(199, 26%, 70%)
Luminance
0.459
Bleached Silk #F2F2F2
RGB
rgb(242, 242, 242)
HSL
hsl(0, 0%, 95%)
Luminance
0.888
Lima #A8ED77
RGB
rgb(168, 237, 119)
HSL
hsl(95, 77%, 70%)
Luminance
0.702
Lawn Party #5FBC62
RGB
rgb(95, 188, 98)
HSL
hsl(122, 41%, 55%)
Luminance
0.393
Genever Green #326D42
RGB
rgb(50, 109, 66)
HSL
hsl(136, 37%, 31%)
Luminance
0.120
Blossom Yellow #E2CB7C
RGB
rgb(226, 203, 124)
HSL
hsl(46, 64%, 69%)
Luminance
0.603
Apricot Buff #CF7E53
RGB
rgb(207, 126, 83)
HSL
hsl(21, 56%, 57%)
Luminance
0.288
Berry Rossi #932443
RGB
rgb(147, 36, 67)
HSL
hsl(343, 61%, 36%)
Luminance
0.079
Rojo Marrón #493127
RGB
rgb(73, 49, 39)
HSL
hsl(18, 30%, 22%)
Luminance
0.038

Contrast & accessibility

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

Aa #1B1F1D on #F2F2F2 14.88:1 AAA
Aa #1B1F1D on #A8ED77 11.94:1 AAA
Aa #F2F2F2 on #493127 10.71:1 AAA
Aa #2E3A43 on #F2F2F2 10.41:1 AAA
Aa #1B1F1D on #E2CB7C 10.37:1 AAA
Aa #A8ED77 on #493127 8.59:1 AAA
Aa #2E3A43 on #A8ED77 8.35:1 AAA
Aa #1B1F1D on #9DB9C6 8.08:1 AAA
Aa #E2CB7C on #493127 7.46:1 AAA
Aa #F2F2F2 on #932443 7.29:1 AAA
Aa #2E3A43 on #E2CB7C 7.25:1 AAA
Aa #1B1F1D on #5FBC62 7.03:1 AAA
Aa #A8ED77 on #932443 5.84:1 AA
Aa #9DB9C6 on #493127 5.82:1 AA
Aa #2E3A43 on #9DB9C6 5.65:1 AA
Aa #F2F2F2 on #326D42 5.51:1 AA
Aa #1B1F1D on #CF7E53 5.37:1 AA
Aa #E2CB7C on #932443 5.08:1 AA
Aa #5FBC62 on #493127 5.06:1 AA
Aa #2E3A43 on #5FBC62 4.91:1 AA
Aa #A8ED77 on #326D42 4.42:1 AA Large
Aa #5A7880 on #F2F2F2 4.23:1 AA Large
Aa #9DB9C6 on #932443 3.96:1 AA Large
Aa #CF7E53 on #493127 3.86:1 AA Large
Aa #326D42 on #E2CB7C 3.84:1 AA Large
Aa #2E3A43 on #CF7E53 3.75:1 AA Large
Aa #1B1F1D on #5A7880 3.52:1 AA Large
Aa #5FBC62 on #932443 3.44:1 AA Large
Aa #5A7880 on #A8ED77 3.39:1 AA Large
Aa #9DB9C6 on #326D42 3.00:1 AA Large
Aa #5A7880 on #E2CB7C 2.95:1 Fail
Aa #F2F2F2 on #CF7E53 2.77:1 Fail
Aa #1B1F1D on #326D42 2.70:1 Fail
Aa #CF7E53 on #932443 2.63:1 Fail
Aa #5FBC62 on #326D42 2.60:1 Fail
Aa #5A7880 on #493127 2.53:1 Fail
Aa #2E3A43 on #5A7880 2.46:1 Fail
Aa #5A7880 on #9DB9C6 2.30:1 Fail
Aa #A8ED77 on #CF7E53 2.22:1 Fail
Aa #F2F2F2 on #5FBC62 2.12:1 Fail
Aa #1B1F1D on #932443 2.04:1 Fail
Aa #5A7880 on #5FBC62 2.00:1 Fail
Aa #326D42 on #CF7E53 1.99:1 Fail
Aa #326D42 on #493127 1.94:1 Fail
Aa #E2CB7C on #CF7E53 1.93:1 Fail
Aa #2E3A43 on #326D42 1.89:1 Fail
Aa #9DB9C6 on #F2F2F2 1.84:1 Fail
Aa #5A7880 on #932443 1.72:1 Fail
Aa #A8ED77 on #5FBC62 1.70:1 Fail
Aa #5A7880 on #CF7E53 1.53:1 Fail
Aa #9DB9C6 on #CF7E53 1.51:1 Fail
Aa #9DB9C6 on #A8ED77 1.48:1 Fail
Aa #5FBC62 on #E2CB7C 1.48:1 Fail
Aa #932443 on #493127 1.47:1 Fail
Aa #F2F2F2 on #E2CB7C 1.44:1 Fail
Aa #1B1F1D on #2E3A43 1.43:1 Fail
Aa #2E3A43 on #932443 1.43:1 Fail
Aa #1B1F1D on #493127 1.39:1 Fail
Aa #326D42 on #932443 1.32:1 Fail
Aa #5FBC62 on #CF7E53 1.31:1 Fail
Aa #5A7880 on #326D42 1.30:1 Fail
Aa #9DB9C6 on #E2CB7C 1.28:1 Fail
Aa #F2F2F2 on #A8ED77 1.25:1 Fail
Aa #9DB9C6 on #5FBC62 1.15:1 Fail
Aa #A8ED77 on #E2CB7C 1.15:1 Fail
Aa #2E3A43 on #493127 1.03: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