Crayolablind

Crayolablind

9-color palette · Warm · Mixed · Complementary harmony

Crayolablind

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

Modify
Vibrant 9 colors Warm Mixed Complementary challenge pixeljoint
Likes 8
Colors 9


CSS variables

:root {
  --c-vibrant-1: #8E3179;
  --c-vibrant-2: #CA3435;
  --c-vibrant-3: #FF91A4;
  --c-vibrant-4: #FCD667;
  --c-vibrant-5: #93DFB8;
  --c-vibrant-6: #B5B35C;
  --c-vibrant-7: #02A4D3;
  --c-vibrant-8: #00468C;
  --c-vibrant-9: #FFFFFF;
}

About this palette

This 9-color vibrant palette runs from White (#FFFFFF) as its lightest tone to Congress Blue (#00468C) as its darkest. It blends Violet Vixen, Young Mahogany, Salmon Pink, Yuzu Marmalade, Green Jewel, Hemp Tea, Malibu Blue, Congress Blue and White into a single set you can drop straight into a UI. Of its 36 color pairings, 7 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #00468C on #FFFFFF at 9.31:1.

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


Color breakdown

Violet Vixen #8E3179
RGB
rgb(142, 49, 121)
HSL
hsl(314, 49%, 37%)
Luminance
0.093
Young Mahogany #CA3435
RGB
rgb(202, 52, 53)
HSL
hsl(360, 59%, 50%)
Luminance
0.153
Salmon Pink #FF91A4
RGB
rgb(255, 145, 164)
HSL
hsl(350, 100%, 78%)
Luminance
0.442
Yuzu Marmalade #FCD667
RGB
rgb(252, 214, 103)
HSL
hsl(45, 96%, 70%)
Luminance
0.698
Green Jewel #93DFB8
RGB
rgb(147, 223, 184)
HSL
hsl(149, 54%, 73%)
Luminance
0.624
Hemp Tea #B5B35C
RGB
rgb(181, 179, 92)
HSL
hsl(59, 38%, 54%)
Luminance
0.428
Malibu Blue #02A4D3
RGB
rgb(2, 164, 211)
HSL
hsl(193, 98%, 42%)
Luminance
0.313
Congress Blue #00468C
RGB
rgb(0, 70, 140)
HSL
hsl(210, 100%, 27%)
Luminance
0.063
White #FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
Luminance
1.000

Contrast & accessibility

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

Aa #00468C on #FFFFFF 9.31:1 AAA
Aa #8E3179 on #FFFFFF 7.33:1 AAA
Aa #FCD667 on #00468C 6.63:1 AA
Aa #93DFB8 on #00468C 5.98:1 AA
Aa #8E3179 on #FCD667 5.22:1 AA
Aa #CA3435 on #FFFFFF 5.18:1 AA
Aa #8E3179 on #93DFB8 4.71:1 AA
Aa #FF91A4 on #00468C 4.36:1 AA Large
Aa #B5B35C on #00468C 4.24:1 AA Large
Aa #CA3435 on #FCD667 3.69:1 AA Large
Aa #8E3179 on #FF91A4 3.43:1 AA Large
Aa #8E3179 on #B5B35C 3.34:1 AA Large
Aa #CA3435 on #93DFB8 3.33:1 AA Large
Aa #02A4D3 on #00468C 3.22:1 AA Large
Aa #02A4D3 on #FFFFFF 2.90:1 Fail
Aa #8E3179 on #02A4D3 2.53:1 Fail
Aa #CA3435 on #FF91A4 2.43:1 Fail
Aa #CA3435 on #B5B35C 2.36:1 Fail
Aa #B5B35C on #FFFFFF 2.19:1 Fail
Aa #FF91A4 on #FFFFFF 2.13:1 Fail
Aa #FCD667 on #02A4D3 2.06:1 Fail
Aa #93DFB8 on #02A4D3 1.86:1 Fail
Aa #CA3435 on #00468C 1.80:1 Fail
Aa #CA3435 on #02A4D3 1.79:1 Fail
Aa #FCD667 on #B5B35C 1.56:1 Fail
Aa #93DFB8 on #FFFFFF 1.56:1 Fail
Aa #FF91A4 on #FCD667 1.52:1 Fail
Aa #8E3179 on #CA3435 1.41:1 Fail
Aa #93DFB8 on #B5B35C 1.41:1 Fail
Aa #FCD667 on #FFFFFF 1.40:1 Fail
Aa #FF91A4 on #93DFB8 1.37:1 Fail
Aa #FF91A4 on #02A4D3 1.36:1 Fail
Aa #B5B35C on #02A4D3 1.32:1 Fail
Aa #8E3179 on #00468C 1.27:1 Fail
Aa #FCD667 on #93DFB8 1.11:1 Fail
Aa #FF91A4 on #B5B35C 1.03: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