Sign Up Sign Up
Sugary Stupor

Sugary Stupor

7-color palette · Cool · Mixed · Analogous harmony

Back to Library

Sugary Stupor

7-color palette · Cool temperature · Mixed tone · Analogous harmony

Modify
Vibrant 7 colors Cool Mixed Analogous
Likes 46
Colors 7

CSS variables

:root {
  --c-vibrant-1: #BDC5EF;
  --c-vibrant-2: #9393EB;
  --c-vibrant-3: #8567E0;
  --c-vibrant-4: #7530CF;
  --c-vibrant-5: #5D2B97;
  --c-vibrant-6: #4B1F6B;
  --c-vibrant-7: #371646;
}

About this palette

This 7-color vibrant palette runs from Vodka (#BDC5EF) as its lightest tone to Purple Door (#371646) as its darkest. It blends Vodka, Perrywinkle, Medium Slate Blue, Sagat Purple, Lucid Dreams, Fading Horizon and Purple Door into a single set you can drop straight into a UI. Of its 21 color pairings, 4 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #BDC5EF on #371646 at 9.08:1.

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

Color breakdown

Vodka #BDC5EF
RGB
rgb(189, 197, 239)
HSL
hsl(230, 61%, 84%)
Luminance
0.570
Perrywinkle #9393EB
RGB
rgb(147, 147, 235)
HSL
hsl(240, 69%, 75%)
Luminance
0.331
Medium Slate Blue #8567E0
RGB
rgb(133, 103, 224)
HSL
hsl(255, 66%, 64%)
Luminance
0.201
Sagat Purple #7530CF
RGB
rgb(117, 48, 207)
HSL
hsl(266, 62%, 50%)
Luminance
0.104
Lucid Dreams #5D2B97
RGB
rgb(93, 43, 151)
HSL
hsl(268, 56%, 38%)
Luminance
0.063
Fading Horizon #4B1F6B
RGB
rgb(75, 31, 107)
HSL
hsl(275, 55%, 27%)
Luminance
0.035
Purple Door #371646
RGB
rgb(55, 22, 70)
HSL
hsl(281, 52%, 18%)
Luminance
0.018

Contrast & accessibility

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

Aa #BDC5EF on #371646 9.08:1 AAA
Aa #BDC5EF on #4B1F6B 7.26:1 AAA
Aa #9393EB on #371646 5.58:1 AA
Aa #BDC5EF on #5D2B97 5.49:1 AA
Aa #9393EB on #4B1F6B 4.46:1 AA Large
Aa #BDC5EF on #7530CF 4.02:1 AA Large
Aa #8567E0 on #371646 3.67:1 AA Large
Aa #9393EB on #5D2B97 3.37:1 AA Large
Aa #8567E0 on #4B1F6B 2.94:1 Fail
Aa #BDC5EF on #8567E0 2.47:1 Fail
Aa #9393EB on #7530CF 2.47:1 Fail
Aa #7530CF on #371646 2.26:1 Fail
Aa #8567E0 on #5D2B97 2.22:1 Fail
Aa #7530CF on #4B1F6B 1.80:1 Fail
Aa #5D2B97 on #371646 1.65:1 Fail
Aa #BDC5EF on #9393EB 1.63:1 Fail
Aa #8567E0 on #7530CF 1.63:1 Fail
Aa #9393EB on #8567E0 1.52:1 Fail
Aa #7530CF on #5D2B97 1.36:1 Fail
Aa #5D2B97 on #4B1F6B 1.32:1 Fail
Aa #4B1F6B on #371646 1.25:1 Fail

Similar palettes

#222831 #393E46 #00ADB5 #EEEEEE
4 colors
#F9F7F7 #DBE2EF #3F72AF #112D4E
4 colors
#1B262C #0F4C75 #3282B8 #BBE1FA
4 colors
#08D9D6 #252A34 #FF2E63 #EAEAEA
4 colors
#27374D #526D82 #9DB2BF #DDE6ED
4 colors
#364F6B #3FC1C9 #F5F5F5 #FC5185
4 colors
#E4F9F5 #30E3CA #11999E #40514E
4 colors
#F0F5F9 #C9D6DF #52616B #1E2022
4 colors