Vicious Violet to Five Star color palette
924A90Vicious Violet003E22Lost in the WoodsDF8B00Hotter Butter703658Passionate PlumD5E8FFVeiling WaterfallsFFA940Five Star
About this palette
Vicious Violet to Five Star is a 6-color palette: #924A90 (Vicious Violet), #003E22 (Lost in the Woods), #DF8B00 (Hotter Butter), #703658 (Passionate Plum), #D5E8FF (Veiling Waterfalls), #FFA940 (Five Star). It mixes pink, green, orange, red, blue tones and feels balanced overall. The strongest text pairing is #003E22 on #D5E8FF with a contrast ratio of 9.82:1, and 6 of its 15 color pairs pass WCAG AA for normal text.
Color codes
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Vicious Violet | rgb(146, 74, 144) | hsl(302, 33%, 43%) | |
| Lost in the Woods | rgb(0, 62, 34) | hsl(153, 100%, 12%) | |
| Hotter Butter | rgb(223, 139, 0) | hsl(37, 100%, 44%) | |
| Passionate Plum | rgb(112, 54, 88) | hsl(325, 35%, 33%) | |
| Veiling Waterfalls | rgb(213, 232, 255) | hsl(213, 100%, 92%) | |
| Five Star | rgb(255, 169, 64) | hsl(33, 100%, 63%) |
Accessible color pairs
Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.
- Aa9.82:1 #003E22 on #D5E8FF
- Aa9.82:1 #D5E8FF on #003E22
- Aa7.13:1 #703658 on #D5E8FF
- Aa7.13:1 #D5E8FF on #703658
- Aa6.43:1 #003E22 on #FFA940
- Aa6.43:1 #FFA940 on #003E22
- Aa4.67:1 #703658 on #FFA940
- Aa4.67:1 #FFA940 on #703658
Color blindness preview
- Protanopia
- Deuteranopia
- Tritanopia
- Achromatopsia
- Dog vision
CSS variables
/* Vicious Violet to Five Star — https://swatchly.xyz/palette/924a90-003e22-df8b00-703658-d5e8ff-ffa940 */
:root {
--vicious-violet: #924a90;
--lost-in-the-woods: #003e22;
--hotter-butter: #df8b00;
--passionate-plum: #703658;
--veiling-waterfalls: #d5e8ff;
--five-star: #ffa940;
}
Tailwind CSS v4
/* Vicious Violet to Five Star — https://swatchly.xyz/palette/924a90-003e22-df8b00-703658-d5e8ff-ffa940 */
@theme {
--color-vicious-violet: #924a90;
--color-vicious-violet-50: #fff0fe;
--color-vicious-violet-100: #ffdffd;
--color-vicious-violet-200: #fbc0f8;
--color-vicious-violet-300: #e9a5e5;
--color-vicious-violet-400: #cb82c8;
--color-vicious-violet-500: #af65ac;
--color-vicious-violet-600: #924a90;
--color-vicious-violet-700: #773775;
--color-vicious-violet-800: #5f275e;
--color-vicious-violet-900: #4b1b4a;
--color-vicious-violet-950: #310e30;
--color-lost-in-the-woods: #003e22;
--color-lost-in-the-woods-50: #dffeea;
--color-lost-in-the-woods-100: #d3f5de;
--color-lost-in-the-woods-200: #bae3c8;
--color-lost-in-the-woods-300: #9fceb0;
--color-lost-in-the-woods-400: #7bb08f;
--color-lost-in-the-woods-500: #5e9473;
--color-lost-in-the-woods-600: #44795a;
--color-lost-in-the-woods-700: #306145;
--color-lost-in-the-woods-800: #214d34;
--color-lost-in-the-woods-900: #003e22;
--color-lost-in-the-woods-950: #0a2517;
--color-hotter-butter: #df8b00;
--color-hotter-butter-50: #fff3e6;
--color-hotter-butter-100: #ffe6cd;
--color-hotter-butter-200: #ffcc97;
--color-hotter-butter-300: #f9af59;
--color-hotter-butter-400: #df8b00;
--color-hotter-butter-500: #ba7300;
--color-hotter-butter-600: #975c00;
--color-hotter-butter-700: #784900;
--color-hotter-butter-800: #5f3800;
--color-hotter-butter-900: #4a2b00;
--color-hotter-butter-950: #2f1900;
--color-passionate-plum: #703658;
--color-passionate-plum-50: #fff0f8;
--color-passionate-plum-100: #ffe2f1;
--color-passionate-plum-200: #f9c4e0;
--color-passionate-plum-300: #e5a9c9;
--color-passionate-plum-400: #c686a9;
--color-passionate-plum-500: #a8698c;
--color-passionate-plum-600: #894e70;
--color-passionate-plum-700: #703658;
--color-passionate-plum-800: #572a44;
--color-passionate-plum-900: #441f35;
--color-passionate-plum-950: #2c1121;
--color-veiling-waterfalls: #d5e8ff;
--color-veiling-waterfalls-50: #e7f2ff;
--color-veiling-waterfalls-100: #d5e8ff;
--color-veiling-waterfalls-200: #c6d5e6;
--color-veiling-waterfalls-300: #afbfd3;
--color-veiling-waterfalls-400: #90a1b6;
--color-veiling-waterfalls-500: #75869b;
--color-veiling-waterfalls-600: #5c6d80;
--color-veiling-waterfalls-700: #485768;
--color-veiling-waterfalls-800: #374453;
--color-veiling-waterfalls-900: #293441;
--color-veiling-waterfalls-950: #182029;
--color-five-star: #ffa940;
--color-five-star-50: #fff1e4;
--color-five-star-100: #ffe4ca;
--color-five-star-200: #ffca93;
--color-five-star-300: #ffa940;
--color-five-star-400: #db8b1d;
--color-five-star-500: #ba7200;
--color-five-star-600: #965b00;
--color-five-star-700: #784800;
--color-five-star-800: #5f3800;
--color-five-star-900: #4a2a00;
--color-five-star-950: #301900;
}
Similar palettes
- D1E2FF72AD67A07100E4AF47864185005A25Puffy Cloud to O Tannenbaum
- 00352B854C66B6778CE2B771D3E2FFPitch-Black Forests to Puffy Cloud
- BEE9F5E296680D3109845988Icy Breeze to Muted Purple
- 834C6EC7B086113E34CFE1FF479F7AGrape Kiss to Natural Orchestra
- CBEEFFF0803C8F1D4F003028008B79Veiling Waterfalls to Go Go Green
- 90EAF2EAAC34AF67BC90549E624300003439Bath Water to Elite Teal
- 9E4E587B4042CBDDFF6BA7A23B2D18D9B367Cherry Berry to Caramel Essence
- CEE0FFE1A1009D44A2275E002B1B00Icy Plains to Burnt Coffee