Sign Up Sign Up
RAINBOWPOP12

RAINBOWPOP12

12-color palette · Neutral · Mixed · Complementary harmony

Back to Library

RAINBOWPOP12

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

Modify
Vibrant 12 colors Neutral Mixed Complementary bright candy rainbow sweet
Likes 18
Colors 12

CSS variables

:root {
  --c-vibrant-1: #BF0F44;
  --c-vibrant-2: #E0690D;
  --c-vibrant-3: #F2F20A;
  --c-vibrant-4: #FDFFE0;
  --c-vibrant-5: #8BE615;
  --c-vibrant-6: #08BD59;
  --c-vibrant-7: #00D1D1;
  --c-vibrant-8: #0075CF;
  --c-vibrant-9: #3C1FAD;
  --c-vibrant-10: #310340;
  --c-vibrant-11: #8B2299;
  --c-vibrant-12: #D44696;
}

About this palette

This 12-color vibrant palette runs from Ceramite White (#FDFFE0) as its lightest tone to Dark Violet (#310340) as its darkest. It blends Red Jalapeño, Tiger Moth Orange, Huáng Sè Yellow, Ceramite White, Poisonous Pistachio, Pistou Green, Jade Glass, Wizard Blue, Indigo Blue, Dark Violet, Passionate Purple and Kirby into a single set you can drop straight into a UI. Of its 66 color pairings, 16 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #FDFFE0 on #310340 at 16.88:1.

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

Color breakdown

Red Jalapeño #BF0F44
RGB
rgb(191, 15, 68)
HSL
hsl(342, 85%, 40%)
Luminance
0.118
Tiger Moth Orange #E0690D
RGB
rgb(224, 105, 13)
HSL
hsl(26, 89%, 46%)
Luminance
0.260
Huáng Sè Yellow #F2F20A
RGB
rgb(242, 242, 10)
HSL
hsl(60, 92%, 49%)
Luminance
0.824
Ceramite White #FDFFE0
RGB
rgb(253, 255, 224)
HSL
hsl(64, 100%, 94%)
Luminance
0.978
Poisonous Pistachio #8BE615
RGB
rgb(139, 230, 21)
HSL
hsl(86, 83%, 49%)
Luminance
0.621
Pistou Green #08BD59
RGB
rgb(8, 189, 89)
HSL
hsl(147, 92%, 39%)
Luminance
0.372
Jade Glass #00D1D1
RGB
rgb(0, 209, 209)
HSL
hsl(180, 100%, 41%)
Luminance
0.502
Wizard Blue #0075CF
RGB
rgb(0, 117, 207)
HSL
hsl(206, 100%, 41%)
Luminance
0.172
Indigo Blue #3C1FAD
RGB
rgb(60, 31, 173)
HSL
hsl(252, 70%, 40%)
Luminance
0.050
Dark Violet #310340
RGB
rgb(49, 3, 64)
HSL
hsl(285, 91%, 13%)
Luminance
0.011
Passionate Purple #8B2299
RGB
rgb(139, 34, 153)
HSL
hsl(293, 64%, 37%)
Luminance
0.089
Kirby #D44696
RGB
rgb(212, 70, 150)
HSL
hsl(326, 62%, 55%)
Luminance
0.206

Contrast & accessibility

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

Aa #FDFFE0 on #310340 16.88:1 AAA
Aa #F2F20A on #310340 14.36:1 AAA
Aa #8BE615 on #310340 11.03:1 AAA
Aa #FDFFE0 on #3C1FAD 10.32:1 AAA
Aa #00D1D1 on #310340 9.07:1 AAA
Aa #F2F20A on #3C1FAD 8.78:1 AAA
Aa #FDFFE0 on #8B2299 7.38:1 AAA
Aa #08BD59 on #310340 6.93:1 AA
Aa #8BE615 on #3C1FAD 6.74:1 AA
Aa #F2F20A on #8B2299 6.27:1 AA
Aa #BF0F44 on #FDFFE0 6.11:1 AA
Aa #00D1D1 on #3C1FAD 5.54:1 AA
Aa #BF0F44 on #F2F20A 5.19:1 AA
Aa #E0690D on #310340 5.09:1 AA
Aa #8BE615 on #8B2299 4.82:1 AA
Aa #FDFFE0 on #0075CF 4.62:1 AA
Aa #08BD59 on #3C1FAD 4.23:1 AA Large
Aa #310340 on #D44696 4.20:1 AA Large
Aa #FDFFE0 on #D44696 4.02:1 AA Large
Aa #BF0F44 on #8BE615 3.99:1 AA Large
Aa #00D1D1 on #8B2299 3.96:1 AA Large
Aa #F2F20A on #0075CF 3.93:1 AA Large
Aa #0075CF on #310340 3.65:1 AA Large
Aa #F2F20A on #D44696 3.42:1 AA Large
Aa #E0690D on #FDFFE0 3.32:1 AA Large
Aa #BF0F44 on #00D1D1 3.28:1 AA Large
Aa #E0690D on #3C1FAD 3.11:1 AA Large
Aa #08BD59 on #8B2299 3.03:1 AA Large
Aa #8BE615 on #0075CF 3.02:1 AA Large
Aa #E0690D on #F2F20A 2.82:1 Fail
Aa #BF0F44 on #310340 2.77:1 Fail
Aa #8BE615 on #D44696 2.62:1 Fail
Aa #3C1FAD on #D44696 2.57:1 Fail
Aa #BF0F44 on #08BD59 2.50:1 Fail
Aa #00D1D1 on #0075CF 2.48:1 Fail
Aa #FDFFE0 on #08BD59 2.44:1 Fail
Aa #310340 on #8B2299 2.29:1 Fail
Aa #0075CF on #3C1FAD 2.23:1 Fail
Aa #E0690D on #8B2299 2.22:1 Fail
Aa #E0690D on #8BE615 2.17:1 Fail
Aa #00D1D1 on #D44696 2.16:1 Fail
Aa #F2F20A on #08BD59 2.07:1 Fail
Aa #08BD59 on #0075CF 1.90:1 Fail
Aa #FDFFE0 on #00D1D1 1.86:1 Fail
Aa #BF0F44 on #E0690D 1.84:1 Fail
Aa #8B2299 on #D44696 1.84:1 Fail
Aa #E0690D on #00D1D1 1.78:1 Fail
Aa #BF0F44 on #3C1FAD 1.69:1 Fail
Aa #08BD59 on #D44696 1.65:1 Fail
Aa #3C1FAD on #310340 1.64:1 Fail
Aa #0075CF on #8B2299 1.60:1 Fail
Aa #8BE615 on #08BD59 1.59:1 Fail
Aa #F2F20A on #00D1D1 1.58:1 Fail
Aa #FDFFE0 on #8BE615 1.53:1 Fail
Aa #BF0F44 on #D44696 1.52:1 Fail
Aa #3C1FAD on #8B2299 1.40:1 Fail
Aa #E0690D on #0075CF 1.39:1 Fail
Aa #E0690D on #08BD59 1.36:1 Fail
Aa #BF0F44 on #0075CF 1.32:1 Fail
Aa #08BD59 on #00D1D1 1.31:1 Fail
Aa #F2F20A on #8BE615 1.30:1 Fail
Aa #8BE615 on #00D1D1 1.22:1 Fail
Aa #BF0F44 on #8B2299 1.21:1 Fail
Aa #E0690D on #D44696 1.21:1 Fail
Aa #F2F20A on #FDFFE0 1.18:1 Fail
Aa #0075CF on #D44696 1.15:1 Fail

Similar palettes

#EDF1D6 #9DC08B #609966 #40513B
4 colors
#F5F7F8 #F4CE14 #495E57 #45474B
4 colors
#222831 #393E46 #FFD369 #EEEEEE
4 colors
#000000 #52057B #892CDC #BC6FF1
4 colors
#213555 #3E5879 #D8C4B6 #F5EFE7
4 colors
#F5EFE7 #D8C4B6 #4F709C #213555
4 colors
#191A19 #1E5128 #4E9F3D #D8E9A8
4 colors
#352F44 #5C5470 #B9B4C7 #FAF0E6
4 colors