Sign Up Sign Up
Fruitpunch 8 πŸ‡πŸ“πŸπŸ

Fruitpunch 8 πŸ‡πŸ“πŸπŸ

8-color palette Β· Warm Β· Mixed Β· Complementary harmony

Back to Library

Fruitpunch 8 πŸ‡πŸ“πŸπŸ

8-color palette Β· Warm temperature Β· Mixed tone Β· Complementary harmony

Modify
Vibrant 8 colors Warm Mixed Complementary polyphrog rainbow fruit
Likes 88
Colors 8

CSS variables

:root {
  --c-vibrant-1: #120E23;
  --c-vibrant-2: #472859;
  --c-vibrant-3: #225875;
  --c-vibrant-4: #C53062;
  --c-vibrant-5: #249E4F;
  --c-vibrant-6: #F28941;
  --c-vibrant-7: #B4DC3A;
  --c-vibrant-8: #FFF1A9;
}

About this palette

This 8-color vibrant palette runs from Transparent Yellow (#FFF1A9) as its lightest tone to Corbeau (#120E23) as its darkest. It blends Corbeau, Acai, Sea Hunter, Maroon Light, Militant Vegan, Hot Orange, Acid Lime and Transparent Yellow into a single set you can drop straight into a UI. Of its 28 color pairings, 10 meet the WCAG AA contrast threshold (4.5:1) for body text β€” the strongest is #120E23 on #FFF1A9 at 16.54:1.

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

Color breakdown

Corbeau #120E23
RGB
rgb(18, 14, 35)
HSL
hsl(251, 43%, 10%)
Luminance
0.006
Acai #472859
RGB
rgb(71, 40, 89)
HSL
hsl(278, 38%, 25%)
Luminance
0.036
Sea Hunter #225875
RGB
rgb(34, 88, 117)
HSL
hsl(201, 55%, 30%)
Luminance
0.086
Maroon Light #C53062
RGB
rgb(197, 48, 98)
HSL
hsl(340, 61%, 48%)
Luminance
0.149
Militant Vegan #249E4F
RGB
rgb(36, 158, 79)
HSL
hsl(141, 63%, 38%)
Luminance
0.254
Hot Orange #F28941
RGB
rgb(242, 137, 65)
HSL
hsl(24, 87%, 60%)
Luminance
0.372
Acid Lime #B4DC3A
RGB
rgb(180, 220, 58)
HSL
hsl(75, 70%, 55%)
Luminance
0.612
Transparent Yellow #FFF1A9
RGB
rgb(255, 241, 169)
HSL
hsl(50, 100%, 83%)
Luminance
0.870

Contrast & accessibility

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

Aa #120E23 on #FFF1A9 16.54:1 AAA
Aa #120E23 on #B4DC3A 11.90:1 AAA
Aa #472859 on #FFF1A9 10.73:1 AAA
Aa #472859 on #B4DC3A 7.72:1 AAA
Aa #120E23 on #F28941 7.58:1 AAA
Aa #225875 on #FFF1A9 6.77:1 AA
Aa #120E23 on #249E4F 5.46:1 AA
Aa #472859 on #F28941 4.91:1 AA
Aa #225875 on #B4DC3A 4.87:1 AA
Aa #C53062 on #FFF1A9 4.63:1 AA
Aa #120E23 on #C53062 3.57:1 AA Large
Aa #472859 on #249E4F 3.54:1 AA Large
Aa #C53062 on #B4DC3A 3.33:1 AA Large
Aa #225875 on #F28941 3.10:1 AA Large
Aa #249E4F on #FFF1A9 3.03:1 AA Large
Aa #120E23 on #225875 2.44:1 Fail
Aa #472859 on #C53062 2.32:1 Fail
Aa #225875 on #249E4F 2.23:1 Fail
Aa #249E4F on #B4DC3A 2.18:1 Fail
Aa #F28941 on #FFF1A9 2.18:1 Fail
Aa #C53062 on #F28941 2.12:1 Fail
Aa #472859 on #225875 1.59:1 Fail
Aa #F28941 on #B4DC3A 1.57:1 Fail
Aa #120E23 on #472859 1.54:1 Fail
Aa #C53062 on #249E4F 1.53:1 Fail
Aa #225875 on #C53062 1.46:1 Fail
Aa #249E4F on #F28941 1.39:1 Fail
Aa #B4DC3A on #FFF1A9 1.39: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