Sign Up Sign Up
Jungle Level

Jungle Level

12-color palette · Warm · Mixed · Complementary harmony

Back to Library

Jungle Level

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

Modify
Vibrant 12 colors Warm Mixed Complementary artist pixeljoint
Likes 11
Colors 12

CSS variables

:root {
  --c-vibrant-1: #856360;
  --c-vibrant-2: #8D2887;
  --c-vibrant-3: #2B180A;
  --c-vibrant-4: #862A00;
  --c-vibrant-5: #C76735;
  --c-vibrant-6: #E29F51;
  --c-vibrant-7: #C5E369;
  --c-vibrant-8: #C8EDE0;
  --c-vibrant-9: #4492EE;
  --c-vibrant-10: #698426;
  --c-vibrant-11: #2E5B3F;
  --c-vibrant-12: #082B0E;
}

About this palette

This 12-color vibrant palette runs from Teal Melody (#C8EDE0) as its lightest tone to Zinnwaldite Brown (#2B180A) as its darkest. It blends Aged Beech, Warm Purple, Zinnwaldite Brown, Red Shade Wash, Winter Sunset, Apple Crisp, Citrus Lime, Teal Melody, Oregon Blue, Straken Green, Emerald Temple and Haunted Forest into a single set you can drop straight into a UI. Of its 66 color pairings, 14 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #2B180A on #C8EDE0 at 13.45:1.

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

Color breakdown

Aged Beech #856360
RGB
rgb(133, 99, 96)
HSL
hsl(5, 16%, 45%)
Luminance
0.148
Warm Purple #8D2887
RGB
rgb(141, 40, 135)
HSL
hsl(304, 56%, 35%)
Luminance
0.089
Zinnwaldite Brown #2B180A
RGB
rgb(43, 24, 10)
HSL
hsl(25, 62%, 10%)
Luminance
0.012
Red Shade Wash #862A00
RGB
rgb(134, 42, 0)
HSL
hsl(19, 100%, 26%)
Luminance
0.067
Winter Sunset #C76735
RGB
rgb(199, 103, 53)
HSL
hsl(21, 58%, 49%)
Luminance
0.221
Apple Crisp #E29F51
RGB
rgb(226, 159, 81)
HSL
hsl(32, 71%, 60%)
Luminance
0.416
Citrus Lime #C5E369
RGB
rgb(197, 227, 105)
HSL
hsl(75, 69%, 65%)
Luminance
0.678
Teal Melody #C8EDE0
RGB
rgb(200, 237, 224)
HSL
hsl(159, 51%, 86%)
Luminance
0.782
Oregon Blue #4492EE
RGB
rgb(68, 146, 238)
HSL
hsl(212, 83%, 60%)
Luminance
0.280
Straken Green #698426
RGB
rgb(105, 132, 38)
HSL
hsl(77, 55%, 33%)
Luminance
0.197
Emerald Temple #2E5B3F
RGB
rgb(46, 91, 63)
HSL
hsl(143, 33%, 27%)
Luminance
0.084
Haunted Forest #082B0E
RGB
rgb(8, 43, 14)
HSL
hsl(130, 69%, 10%)
Luminance
0.018

Contrast & accessibility

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

Aa #2B180A on #C8EDE0 13.45:1 AAA
Aa #C8EDE0 on #082B0E 12.22:1 AAA
Aa #2B180A on #C5E369 11.77:1 AAA
Aa #C5E369 on #082B0E 10.69:1 AAA
Aa #2B180A on #E29F51 7.52:1 AAA
Aa #862A00 on #C8EDE0 7.10:1 AAA
Aa #E29F51 on #082B0E 6.84:1 AA
Aa #862A00 on #C5E369 6.21:1 AA
Aa #C8EDE0 on #2E5B3F 6.20:1 AA
Aa #8D2887 on #C8EDE0 5.98:1 AA
Aa #C5E369 on #2E5B3F 5.43:1 AA
Aa #2B180A on #4492EE 5.33:1 AA
Aa #8D2887 on #C5E369 5.23:1 AA
Aa #4492EE on #082B0E 4.84:1 AA
Aa #2B180A on #C76735 4.38:1 AA Large
Aa #856360 on #C8EDE0 4.21:1 AA Large
Aa #2B180A on #698426 3.98:1 AA Large
Aa #C76735 on #082B0E 3.98:1 AA Large
Aa #862A00 on #E29F51 3.97:1 AA Large
Aa #856360 on #C5E369 3.69:1 AA Large
Aa #698426 on #082B0E 3.62:1 AA Large
Aa #E29F51 on #2E5B3F 3.47:1 AA Large
Aa #C8EDE0 on #698426 3.38:1 AA Large
Aa #8D2887 on #E29F51 3.34:1 AA Large
Aa #856360 on #2B180A 3.19:1 AA Large
Aa #C76735 on #C8EDE0 3.07:1 AA Large
Aa #C5E369 on #698426 2.96:1 Fail
Aa #856360 on #082B0E 2.90:1 Fail
Aa #862A00 on #4492EE 2.81:1 Fail
Aa #C76735 on #C5E369 2.69:1 Fail
Aa #C8EDE0 on #4492EE 2.53:1 Fail
Aa #4492EE on #2E5B3F 2.46:1 Fail
Aa #8D2887 on #4492EE 2.37:1 Fail
Aa #856360 on #E29F51 2.36:1 Fail
Aa #862A00 on #C76735 2.31:1 Fail
Aa #8D2887 on #2B180A 2.25:1 Fail
Aa #C5E369 on #4492EE 2.21:1 Fail
Aa #2B180A on #2E5B3F 2.17:1 Fail
Aa #862A00 on #698426 2.10:1 Fail
Aa #8D2887 on #082B0E 2.05:1 Fail
Aa #C76735 on #2E5B3F 2.02:1 Fail
Aa #2E5B3F on #082B0E 1.97:1 Fail
Aa #8D2887 on #C76735 1.95:1 Fail
Aa #2B180A on #862A00 1.89:1 Fail
Aa #E29F51 on #698426 1.89:1 Fail
Aa #698426 on #2E5B3F 1.84:1 Fail
Aa #E29F51 on #C8EDE0 1.79:1 Fail
Aa #8D2887 on #698426 1.77:1 Fail
Aa #862A00 on #082B0E 1.72:1 Fail
Aa #C76735 on #E29F51 1.72:1 Fail
Aa #856360 on #862A00 1.68:1 Fail
Aa #856360 on #4492EE 1.67:1 Fail
Aa #E29F51 on #C5E369 1.56:1 Fail
Aa #856360 on #2E5B3F 1.47:1 Fail
Aa #856360 on #8D2887 1.42:1 Fail
Aa #E29F51 on #4492EE 1.41:1 Fail
Aa #856360 on #C76735 1.37:1 Fail
Aa #4492EE on #698426 1.34:1 Fail
Aa #856360 on #698426 1.25:1 Fail
Aa #C76735 on #4492EE 1.22:1 Fail
Aa #8D2887 on #862A00 1.19:1 Fail
Aa #862A00 on #2E5B3F 1.14:1 Fail
Aa #C5E369 on #C8EDE0 1.14:1 Fail
Aa #2B180A on #082B0E 1.10:1 Fail
Aa #C76735 on #698426 1.10:1 Fail
Aa #8D2887 on #2E5B3F 1.04: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