Sign Up Sign Up
Violet Voyage

Violet Voyage

9-color palette · Warm · Mixed · Triadic harmony

Back to Library

Violet Voyage

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

Modify
Vibrant 9 colors Warm Mixed Triadic orange pink violet cosmic
Likes 147
Colors 9

CSS variables

:root {
  --c-vibrant-1: #0A0A28;
  --c-vibrant-2: #1D0F3F;
  --c-vibrant-3: #351567;
  --c-vibrant-4: #501F9A;
  --c-vibrant-5: #8B2DDC;
  --c-vibrant-6: #FF45E9;
  --c-vibrant-7: #FF89B4;
  --c-vibrant-8: #FEABAB;
  --c-vibrant-9: #FFC5A0;
}

About this palette

This 9-color vibrant palette runs from Romantic (#FFC5A0) as its lightest tone to Mysterious Depths (#0A0A28) as its darkest. It blends Mysterious Depths, Shadow Planet, Candied Blueberry, Eine Kleine Nachtmusik, Bright Blue Violet, Actinic Light, Cochonnet, Apricot Haze and Romantic into a single set you can drop straight into a UI. Of its 36 color pairings, 15 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #0A0A28 on #FFC5A0 at 12.65:1.

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

Color breakdown

Mysterious Depths #0A0A28
RGB
rgb(10, 10, 40)
HSL
hsl(240, 60%, 10%)
Luminance
0.004
Shadow Planet #1D0F3F
RGB
rgb(29, 15, 63)
HSL
hsl(258, 62%, 15%)
Luminance
0.010
Candied Blueberry #351567
RGB
rgb(53, 21, 103)
HSL
hsl(263, 66%, 24%)
Luminance
0.023
Eine Kleine Nachtmusik #501F9A
RGB
rgb(80, 31, 154)
HSL
hsl(264, 66%, 36%)
Luminance
0.050
Bright Blue Violet #8B2DDC
RGB
rgb(139, 45, 220)
HSL
hsl(272, 71%, 52%)
Luminance
0.125
Actinic Light #FF45E9
RGB
rgb(255, 69, 233)
HSL
hsl(307, 100%, 64%)
Luminance
0.314
Cochonnet #FF89B4
RGB
rgb(255, 137, 180)
HSL
hsl(338, 100%, 77%)
Luminance
0.425
Apricot Haze #FEABAB
RGB
rgb(254, 171, 171)
HSL
hsl(0, 98%, 83%)
Luminance
0.531
Romantic #FFC5A0
RGB
rgb(255, 197, 160)
HSL
hsl(23, 100%, 81%)
Luminance
0.637

Contrast & accessibility

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

Aa #0A0A28 on #FFC5A0 12.65:1 AAA
Aa #1D0F3F on #FFC5A0 11.53:1 AAA
Aa #0A0A28 on #FEABAB 10.70:1 AAA
Aa #1D0F3F on #FEABAB 9.75:1 AAA
Aa #351567 on #FFC5A0 9.45:1 AAA
Aa #0A0A28 on #FF89B4 8.73:1 AAA
Aa #351567 on #FEABAB 7.99:1 AAA
Aa #1D0F3F on #FF89B4 7.96:1 AAA
Aa #501F9A on #FFC5A0 6.86:1 AA
Aa #0A0A28 on #FF45E9 6.70:1 AA
Aa #351567 on #FF89B4 6.52:1 AA
Aa #1D0F3F on #FF45E9 6.11:1 AA
Aa #501F9A on #FEABAB 5.80:1 AA
Aa #351567 on #FF45E9 5.01:1 AA
Aa #501F9A on #FF89B4 4.74:1 AA
Aa #8B2DDC on #FFC5A0 3.92:1 AA Large
Aa #501F9A on #FF45E9 3.63:1 AA Large
Aa #8B2DDC on #FEABAB 3.32:1 AA Large
Aa #0A0A28 on #8B2DDC 3.23:1 AA Large
Aa #1D0F3F on #8B2DDC 2.94:1 Fail
Aa #8B2DDC on #FF89B4 2.71:1 Fail
Aa #351567 on #8B2DDC 2.41:1 Fail
Aa #8B2DDC on #FF45E9 2.08:1 Fail
Aa #FF45E9 on #FFC5A0 1.89:1 Fail
Aa #0A0A28 on #501F9A 1.84:1 Fail
Aa #501F9A on #8B2DDC 1.75:1 Fail
Aa #1D0F3F on #501F9A 1.68:1 Fail
Aa #FF45E9 on #FEABAB 1.60:1 Fail
Aa #FF89B4 on #FFC5A0 1.45:1 Fail
Aa #351567 on #501F9A 1.38:1 Fail
Aa #0A0A28 on #351567 1.34:1 Fail
Aa #FF45E9 on #FF89B4 1.30:1 Fail
Aa #FF89B4 on #FEABAB 1.23:1 Fail
Aa #1D0F3F on #351567 1.22:1 Fail
Aa #FEABAB on #FFC5A0 1.18:1 Fail
Aa #0A0A28 on #1D0F3F 1.10: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