Sign Up Sign Up
Goldiblocks

Goldiblocks

8-color palette · Warm · Light · Analogous harmony

Back to Library

Goldiblocks

8-color palette · Warm temperature · Light tone · Analogous harmony

Modify
Vibrant 8 colors Warm Light Analogous
Likes 17
Colors 8

CSS variables

:root {
  --c-vibrant-1: #662640;
  --c-vibrant-2: #8C3F5D;
  --c-vibrant-3: #BA6156;
  --c-vibrant-4: #F2A65E;
  --c-vibrant-5: #FFE478;
  --c-vibrant-6: #FFEB9E;
  --c-vibrant-7: #FFF5D3;
  --c-vibrant-8: #FFFFFF;
}

About this palette

This 8-color vibrant palette runs from White (#FFFFFF) as its lightest tone to Quills of Terico (#662640) as its darkest. It blends Quills of Terico, Putnam Plum, Electric Brown, Sandy Brown, Summer Daffodil, Rise and Shine, Milk Punch and White into a single set you can drop straight into a UI. Of its 28 color pairings, 9 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #662640 on #FFFFFF at 10.96:1.

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

Color breakdown

Quills of Terico #662640
RGB
rgb(102, 38, 64)
HSL
hsl(336, 46%, 27%)
Luminance
0.046
Putnam Plum #8C3F5D
RGB
rgb(140, 63, 93)
HSL
hsl(337, 38%, 40%)
Luminance
0.099
Electric Brown #BA6156
RGB
rgb(186, 97, 86)
HSL
hsl(7, 42%, 53%)
Luminance
0.197
Sandy Brown #F2A65E
RGB
rgb(242, 166, 94)
HSL
hsl(29, 85%, 66%)
Luminance
0.470
Summer Daffodil #FFE478
RGB
rgb(255, 228, 120)
HSL
hsl(48, 100%, 74%)
Luminance
0.781
Rise and Shine #FFEB9E
RGB
rgb(255, 235, 158)
HSL
hsl(48, 100%, 81%)
Luminance
0.832
Milk Punch #FFF5D3
RGB
rgb(255, 245, 211)
HSL
hsl(46, 100%, 91%)
Luminance
0.913
White #FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
Luminance
1.000

Contrast & accessibility

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

Aa #662640 on #FFFFFF 10.96:1 AAA
Aa #662640 on #FFF5D3 10.05:1 AAA
Aa #662640 on #FFEB9E 9.20:1 AAA
Aa #662640 on #FFE478 8.67:1 AAA
Aa #8C3F5D on #FFFFFF 7.04:1 AAA
Aa #8C3F5D on #FFF5D3 6.45:1 AA
Aa #8C3F5D on #FFEB9E 5.91:1 AA
Aa #8C3F5D on #FFE478 5.57:1 AA
Aa #662640 on #F2A65E 5.42:1 AA
Aa #BA6156 on #FFFFFF 4.26:1 AA Large
Aa #BA6156 on #FFF5D3 3.90:1 AA Large
Aa #BA6156 on #FFEB9E 3.57:1 AA Large
Aa #8C3F5D on #F2A65E 3.48:1 AA Large
Aa #BA6156 on #FFE478 3.37:1 AA Large
Aa #662640 on #BA6156 2.57:1 Fail
Aa #BA6156 on #F2A65E 2.11:1 Fail
Aa #F2A65E on #FFFFFF 2.02:1 Fail
Aa #F2A65E on #FFF5D3 1.85:1 Fail
Aa #F2A65E on #FFEB9E 1.70:1 Fail
Aa #8C3F5D on #BA6156 1.65:1 Fail
Aa #F2A65E on #FFE478 1.60:1 Fail
Aa #662640 on #8C3F5D 1.56:1 Fail
Aa #FFE478 on #FFFFFF 1.26:1 Fail
Aa #FFEB9E on #FFFFFF 1.19:1 Fail
Aa #FFE478 on #FFF5D3 1.16:1 Fail
Aa #FFEB9E on #FFF5D3 1.09:1 Fail
Aa #FFF5D3 on #FFFFFF 1.09:1 Fail
Aa #FFE478 on #FFEB9E 1.06:1 Fail

Similar palettes

#FFF5E4 #FFE3E1 #FFD1D1 #FF9494
4 colors
#F9F5F6 #F8E8EE #FDCEDF #F2BED1
4 colors
#FFC7C7 #FFE2E2 #F6F6F6 #8785A2
4 colors
#AD8B73 #CEAB93 #E3CAA5 #FFFBE9
4 colors
#F38181 #FCE38A #EAFFD0 #95E1D3
4 colors
#B7C4CF #EEE3CB #D7C0AE #967E76
4 colors
#FFEDDB #EDCDBB #E3B7A0 #BF9270
4 colors
#8D7B68 #A4907C #C8B6A6 #F1DEC9
4 colors