Sign Up Sign Up
Totems

Totems

11-color palette · Warm · Mixed · Triadic harmony

Back to Library

Totems

11-color palette · Warm temperature · Mixed tone · Triadic harmony

Modify
Vibrant 11 colors Warm Mixed Triadic pixelart green warm purple
Likes 74
Colors 11

CSS variables

:root {
  --c-vibrant-1: #3A0B33;
  --c-vibrant-2: #75285F;
  --c-vibrant-3: #B32E7C;
  --c-vibrant-4: #DA3C69;
  --c-vibrant-5: #E86363;
  --c-vibrant-6: #F58A6E;
  --c-vibrant-7: #F6C78F;
  --c-vibrant-8: #E6E1AD;
  --c-vibrant-9: #ADCB96;
  --c-vibrant-10: #4C7865;
  --c-vibrant-11: #164C56;
}

About this palette

This 11-color vibrant palette runs from Kiss of Lime (#E6E1AD) as its lightest tone to Cured Eggplant (#3A0B33) as its darkest. It blends Cured Eggplant, Byzantium, Festival Fuchsia, Raspberry Sorbet, Lovely Little Rosy, Juicy Passionfruit, Bellini Fizz, Kiss of Lime, Oh Pistachio, Hooker’s Green and Iron Teal into a single set you can drop straight into a UI. Of its 55 color pairings, 11 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #3A0B33 on #E6E1AD at 12.34:1.

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

Color breakdown

Cured Eggplant #3A0B33
RGB
rgb(58, 11, 51)
HSL
hsl(309, 68%, 14%)
Luminance
0.014
Byzantium #75285F
RGB
rgb(117, 40, 95)
HSL
hsl(317, 49%, 31%)
Luminance
0.061
Festival Fuchsia #B32E7C
RGB
rgb(179, 46, 124)
HSL
hsl(325, 59%, 44%)
Luminance
0.130
Raspberry Sorbet #DA3C69
RGB
rgb(218, 60, 105)
HSL
hsl(343, 68%, 55%)
Luminance
0.192
Lovely Little Rosy #E86363
RGB
rgb(232, 99, 99)
HSL
hsl(0, 74%, 65%)
Luminance
0.270
Juicy Passionfruit #F58A6E
RGB
rgb(245, 138, 110)
HSL
hsl(12, 87%, 70%)
Luminance
0.387
Bellini Fizz #F6C78F
RGB
rgb(246, 199, 143)
HSL
hsl(33, 85%, 76%)
Luminance
0.624
Kiss of Lime #E6E1AD
RGB
rgb(230, 225, 173)
HSL
hsl(55, 53%, 79%)
Luminance
0.737
Oh Pistachio #ADCB96
RGB
rgb(173, 203, 150)
HSL
hsl(94, 34%, 69%)
Luminance
0.538
Hooker’s Green #4C7865
RGB
rgb(76, 120, 101)
HSL
hsl(154, 22%, 38%)
Luminance
0.159
Iron Teal #164C56
RGB
rgb(22, 76, 86)
HSL
hsl(189, 59%, 21%)
Luminance
0.060

Contrast & accessibility

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

Aa #3A0B33 on #E6E1AD 12.34:1 AAA
Aa #3A0B33 on #F6C78F 10.57:1 AAA
Aa #3A0B33 on #ADCB96 9.22:1 AAA
Aa #E6E1AD on #164C56 7.15:1 AAA
Aa #75285F on #E6E1AD 7.07:1 AAA
Aa #3A0B33 on #F58A6E 6.85:1 AA
Aa #F6C78F on #164C56 6.12:1 AA
Aa #75285F on #F6C78F 6.06:1 AA
Aa #ADCB96 on #164C56 5.34:1 AA
Aa #75285F on #ADCB96 5.28:1 AA
Aa #3A0B33 on #E86363 5.01:1 AA
Aa #B32E7C on #E6E1AD 4.37:1 AA Large
Aa #F58A6E on #164C56 3.97:1 AA Large
Aa #75285F on #F58A6E 3.93:1 AA Large
Aa #3A0B33 on #DA3C69 3.79:1 AA Large
Aa #E6E1AD on #4C7865 3.76:1 AA Large
Aa #B32E7C on #F6C78F 3.75:1 AA Large
Aa #3A0B33 on #4C7865 3.28:1 AA Large
Aa #B32E7C on #ADCB96 3.27:1 AA Large
Aa #DA3C69 on #E6E1AD 3.26:1 AA Large
Aa #F6C78F on #4C7865 3.22:1 AA Large
Aa #E86363 on #164C56 2.90:1 Fail
Aa #75285F on #E86363 2.87:1 Fail
Aa #3A0B33 on #B32E7C 2.82:1 Fail
Aa #ADCB96 on #4C7865 2.81:1 Fail
Aa #DA3C69 on #F6C78F 2.79:1 Fail
Aa #E86363 on #E6E1AD 2.46:1 Fail
Aa #B32E7C on #F58A6E 2.43:1 Fail
Aa #DA3C69 on #ADCB96 2.43:1 Fail
Aa #DA3C69 on #164C56 2.19:1 Fail
Aa #75285F on #DA3C69 2.17:1 Fail
Aa #E86363 on #F6C78F 2.11:1 Fail
Aa #F58A6E on #4C7865 2.09:1 Fail
Aa #4C7865 on #164C56 1.90:1 Fail
Aa #75285F on #4C7865 1.88:1 Fail
Aa #E86363 on #ADCB96 1.84:1 Fail
Aa #DA3C69 on #F58A6E 1.81:1 Fail
Aa #F58A6E on #E6E1AD 1.80:1 Fail
Aa #B32E7C on #E86363 1.78:1 Fail
Aa #3A0B33 on #75285F 1.74:1 Fail
Aa #3A0B33 on #164C56 1.73:1 Fail
Aa #B32E7C on #164C56 1.63:1 Fail
Aa #75285F on #B32E7C 1.62:1 Fail
Aa #F58A6E on #F6C78F 1.54:1 Fail
Aa #E86363 on #4C7865 1.53:1 Fail
Aa #E86363 on #F58A6E 1.37:1 Fail
Aa #F58A6E on #ADCB96 1.35:1 Fail
Aa #B32E7C on #DA3C69 1.34:1 Fail
Aa #E6E1AD on #ADCB96 1.34:1 Fail
Aa #DA3C69 on #E86363 1.32:1 Fail
Aa #F6C78F on #E6E1AD 1.17:1 Fail
Aa #B32E7C on #4C7865 1.16:1 Fail
Aa #DA3C69 on #4C7865 1.16:1 Fail
Aa #F6C78F on #ADCB96 1.15:1 Fail
Aa #75285F on #164C56 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