Sign Up Sign Up
Flashy 9

Flashy 9

9-color palette · Warm · Mixed · Complementary harmony

Back to Library

Flashy 9

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

Modify
Vibrant 9 colors Warm Mixed Complementary
Likes 15
Colors 9

CSS variables

:root {
  --c-vibrant-1: #0A030D;
  --c-vibrant-2: #FFFFF7;
  --c-vibrant-3: #2CE8F5;
  --c-vibrant-4: #FFCF00;
  --c-vibrant-5: #FF0059;
  --c-vibrant-6: #004D57;
  --c-vibrant-7: #230C45;
  --c-vibrant-8: #7D2160;
  --c-vibrant-9: #2AD726;
}

About this palette

This 9-color vibrant palette runs from Milk (#FFFFF7) as its lightest tone to Broken Tube (#0A030D) as its darkest. It blends Broken Tube, Milk, Sparky Blue, Fluorescent Orange, New York Sunset, Deep Atlantic Blue, Shadow Planet, Smooch and First of the Month Green into a single set you can drop straight into a UI. Of its 36 color pairings, 17 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #0A030D on #FFFFF7 at 20.26:1.

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

Color breakdown

Broken Tube #0A030D
RGB
rgb(10, 3, 13)
HSL
hsl(282, 63%, 3%)
Luminance
0.002
Milk #FFFFF7
RGB
rgb(255, 255, 247)
HSL
hsl(60, 100%, 98%)
Luminance
0.995
Sparky Blue #2CE8F5
RGB
rgb(44, 232, 245)
HSL
hsl(184, 91%, 57%)
Luminance
0.648
Fluorescent Orange #FFCF00
RGB
rgb(255, 207, 0)
HSL
hsl(49, 100%, 50%)
Luminance
0.659
New York Sunset #FF0059
RGB
rgb(255, 0, 89)
HSL
hsl(339, 100%, 50%)
Luminance
0.220
Deep Atlantic Blue #004D57
RGB
rgb(0, 77, 87)
HSL
hsl(187, 100%, 17%)
Luminance
0.060
Shadow Planet #230C45
RGB
rgb(35, 12, 69)
HSL
hsl(264, 70%, 16%)
Luminance
0.011
Smooch #7D2160
RGB
rgb(125, 33, 96)
HSL
hsl(319, 58%, 31%)
Luminance
0.063
First of the Month Green #2AD726
RGB
rgb(42, 215, 38)
HSL
hsl(119, 70%, 50%)
Luminance
0.492

Contrast & accessibility

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

Aa #0A030D on #FFFFF7 20.26:1 AAA
Aa #FFFFF7 on #230C45 17.27:1 AAA
Aa #0A030D on #FFCF00 13.74:1 AAA
Aa #0A030D on #2CE8F5 13.54:1 AAA
Aa #FFCF00 on #230C45 11.72:1 AAA
Aa #2CE8F5 on #230C45 11.54:1 AAA
Aa #0A030D on #2AD726 10.51:1 AAA
Aa #FFFFF7 on #004D57 9.50:1 AAA
Aa #FFFFF7 on #7D2160 9.25:1 AAA
Aa #230C45 on #2AD726 8.96:1 AAA
Aa #FFCF00 on #004D57 6.45:1 AA
Aa #2CE8F5 on #004D57 6.35:1 AA
Aa #FFCF00 on #7D2160 6.28:1 AA
Aa #2CE8F5 on #7D2160 6.18:1 AA
Aa #0A030D on #FF0059 5.23:1 AA
Aa #004D57 on #2AD726 4.93:1 AA
Aa #7D2160 on #2AD726 4.80:1 AA
Aa #FF0059 on #230C45 4.46:1 AA Large
Aa #FFFFF7 on #FF0059 3.87:1 AA Large
Aa #FFCF00 on #FF0059 2.63:1 Fail
Aa #2CE8F5 on #FF0059 2.59:1 Fail
Aa #FF0059 on #004D57 2.45:1 Fail
Aa #FF0059 on #7D2160 2.39:1 Fail
Aa #0A030D on #7D2160 2.19:1 Fail
Aa #0A030D on #004D57 2.13:1 Fail
Aa #FF0059 on #2AD726 2.01:1 Fail
Aa #FFFFF7 on #2AD726 1.93:1 Fail
Aa #230C45 on #7D2160 1.87:1 Fail
Aa #004D57 on #230C45 1.82:1 Fail
Aa #FFFFF7 on #2CE8F5 1.50:1 Fail
Aa #FFFFF7 on #FFCF00 1.47:1 Fail
Aa #FFCF00 on #2AD726 1.31:1 Fail
Aa #2CE8F5 on #2AD726 1.29:1 Fail
Aa #0A030D on #230C45 1.17:1 Fail
Aa #004D57 on #7D2160 1.03:1 Fail
Aa #2CE8F5 on #FFCF00 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