Sign Up Sign Up
Summer Cream

Summer Cream

12-color palette · Warm · Mixed · Complementary harmony

Back to Library

Summer Cream

12-color palette · Warm temperature · Mixed tone · Complementary harmony

Modify
Earthy 12 colors Warm Mixed Complementary pastel cream summer summercream
Likes 40
Colors 12

CSS variables

:root {
  --c-earthy-1: #361D2B;
  --c-earthy-2: #4F304A;
  --c-earthy-3: #7061CF;
  --c-earthy-4: #ADB8F0;
  --c-earthy-5: #7AD6B7;
  --c-earthy-6: #BBF2CF;
  --c-earthy-7: #D67C99;
  --c-earthy-8: #F2B3B3;
  --c-earthy-9: #FFDFA3;
  --c-earthy-10: #FFFCBA;
  --c-earthy-11: #C9C4A7;
  --c-earthy-12: #FAF8ED;
}

About this palette

This 12-color earthy palette runs from Break of Day (#FFFCBA) as its lightest tone to Antique Burgundy (#361D2B) as its darkest. It blends Antique Burgundy, Grimace, Astro Purple, Perano, Seafoam Blue, Mystery Mint, Little Bow Pink, Jaguar Rose, Cape Honey, Break of Day, Cargo Green and Night Blooming Jasmine into a single set you can drop straight into a UI. Of its 66 color pairings, 19 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #361D2B on #FFFCBA at 14.54:1.

Grounded, natural tones — suits sustainability/organic brands, coffee shops, outdoor gear, and warm editorial typography.

Color breakdown

Antique Burgundy #361D2B
RGB
rgb(54, 29, 43)
HSL
hsl(326, 30%, 16%)
Luminance
0.018
Grimace #4F304A
RGB
rgb(79, 48, 74)
HSL
hsl(310, 24%, 25%)
Luminance
0.043
Astro Purple #7061CF
RGB
rgb(112, 97, 207)
HSL
hsl(248, 53%, 60%)
Luminance
0.165
Perano #ADB8F0
RGB
rgb(173, 184, 240)
HSL
hsl(230, 69%, 81%)
Luminance
0.495
Seafoam Blue #7AD6B7
RGB
rgb(122, 214, 183)
HSL
hsl(160, 53%, 66%)
Luminance
0.557
Mystery Mint #BBF2CF
RGB
rgb(187, 242, 207)
HSL
hsl(142, 68%, 84%)
Luminance
0.786
Little Bow Pink #D67C99
RGB
rgb(214, 124, 153)
HSL
hsl(341, 52%, 66%)
Luminance
0.310
Jaguar Rose #F2B3B3
RGB
rgb(242, 179, 179)
HSL
hsl(0, 71%, 83%)
Luminance
0.544
Cape Honey #FFDFA3
RGB
rgb(255, 223, 163)
HSL
hsl(39, 100%, 82%)
Luminance
0.767
Break of Day #FFFCBA
RGB
rgb(255, 252, 186)
HSL
hsl(57, 100%, 86%)
Luminance
0.944
Cargo Green #C9C4A7
RGB
rgb(201, 196, 167)
HSL
hsl(51, 24%, 72%)
Luminance
0.547
Night Blooming Jasmine #FAF8ED
RGB
rgb(250, 248, 237)
HSL
hsl(51, 57%, 95%)
Luminance
0.936

Contrast & accessibility

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

Aa #361D2B on #FFFCBA 14.54:1 AAA
Aa #361D2B on #FAF8ED 14.42:1 AAA
Aa #361D2B on #BBF2CF 12.22:1 AAA
Aa #361D2B on #FFDFA3 11.95:1 AAA
Aa #4F304A on #FFFCBA 10.72:1 AAA
Aa #4F304A on #FAF8ED 10.63:1 AAA
Aa #4F304A on #BBF2CF 9.01:1 AAA
Aa #361D2B on #7AD6B7 8.87:1 AAA
Aa #4F304A on #FFDFA3 8.81:1 AAA
Aa #361D2B on #C9C4A7 8.73:1 AAA
Aa #361D2B on #F2B3B3 8.68:1 AAA
Aa #361D2B on #ADB8F0 7.96:1 AAA
Aa #4F304A on #7AD6B7 6.54:1 AA
Aa #4F304A on #C9C4A7 6.44:1 AA
Aa #4F304A on #F2B3B3 6.40:1 AA
Aa #4F304A on #ADB8F0 5.87:1 AA
Aa #361D2B on #D67C99 5.27:1 AA
Aa #7061CF on #FFFCBA 4.62:1 AA
Aa #7061CF on #FAF8ED 4.58:1 AA
Aa #7061CF on #BBF2CF 3.89:1 AA Large
Aa #4F304A on #D67C99 3.88:1 AA Large
Aa #7061CF on #FFDFA3 3.80:1 AA Large
Aa #361D2B on #7061CF 3.14:1 AA Large
Aa #7061CF on #7AD6B7 2.82:1 Fail
Aa #7061CF on #C9C4A7 2.78:1 Fail
Aa #7061CF on #F2B3B3 2.76:1 Fail
Aa #D67C99 on #FFFCBA 2.76:1 Fail
Aa #D67C99 on #FAF8ED 2.74:1 Fail
Aa #7061CF on #ADB8F0 2.53:1 Fail
Aa #4F304A on #7061CF 2.32:1 Fail
Aa #BBF2CF on #D67C99 2.32:1 Fail
Aa #D67C99 on #FFDFA3 2.27:1 Fail
Aa #ADB8F0 on #FFFCBA 1.83:1 Fail
Aa #ADB8F0 on #FAF8ED 1.81:1 Fail
Aa #7061CF on #D67C99 1.68:1 Fail
Aa #7AD6B7 on #D67C99 1.68:1 Fail
Aa #F2B3B3 on #FFFCBA 1.67:1 Fail
Aa #FFFCBA on #C9C4A7 1.67:1 Fail
Aa #D67C99 on #C9C4A7 1.66:1 Fail
Aa #F2B3B3 on #FAF8ED 1.66:1 Fail
Aa #D67C99 on #F2B3B3 1.65:1 Fail
Aa #C9C4A7 on #FAF8ED 1.65:1 Fail
Aa #7AD6B7 on #FFFCBA 1.64:1 Fail
Aa #7AD6B7 on #FAF8ED 1.63:1 Fail
Aa #ADB8F0 on #BBF2CF 1.53:1 Fail
Aa #ADB8F0 on #D67C99 1.51:1 Fail
Aa #ADB8F0 on #FFDFA3 1.50:1 Fail
Aa #BBF2CF on #F2B3B3 1.41:1 Fail
Aa #BBF2CF on #C9C4A7 1.40:1 Fail
Aa #7AD6B7 on #BBF2CF 1.38:1 Fail
Aa #F2B3B3 on #FFDFA3 1.38:1 Fail
Aa #FFDFA3 on #C9C4A7 1.37:1 Fail
Aa #361D2B on #4F304A 1.36:1 Fail
Aa #7AD6B7 on #FFDFA3 1.35:1 Fail
Aa #FFDFA3 on #FFFCBA 1.22:1 Fail
Aa #FFDFA3 on #FAF8ED 1.21:1 Fail
Aa #BBF2CF on #FFFCBA 1.19:1 Fail
Aa #BBF2CF on #FAF8ED 1.18:1 Fail
Aa #ADB8F0 on #7AD6B7 1.11:1 Fail
Aa #ADB8F0 on #C9C4A7 1.10:1 Fail
Aa #ADB8F0 on #F2B3B3 1.09:1 Fail
Aa #7AD6B7 on #F2B3B3 1.02:1 Fail
Aa #7AD6B7 on #C9C4A7 1.02:1 Fail
Aa #BBF2CF on #FFDFA3 1.02:1 Fail
Aa #F2B3B3 on #C9C4A7 1.01:1 Fail
Aa #FFFCBA on #FAF8ED 1.01:1 Fail

Similar palettes

#F9ED69 #F08A5D #B83B5E #6A2C70
4 colors
#7D5A50 #B4846C #E5B299 #FCDEC0
4 colors
#FFF8EA #9E7676 #815B5B #594545
4 colors
#2C3639 #3F4E4F #A27B5C #DCD7C9
4 colors
#F67280 #C06C84 #6C5B7B #355C7D
4 colors
#2B2E4A #E84545 #903749 #53354A
4 colors
#E5D9B6 #A4BE7B #5F8D4E #285430
4 colors
#A9907E #F3DEBA #ABC4AA #675D50
4 colors