Sour Lime to What We Do in the Shadows color palette
BBC300Sour Lime9243E2Dreamscape Purple00A89DSilken JadeF8FCBEYellow Mana005946Evergreen4D0B25What We Do in the Shadows
About this palette
Sour Lime to What We Do in the Shadows is a 6-color neon palette: #BBC300 (Sour Lime), #9243E2 (Dreamscape Purple), #00A89D (Silken Jade), #F8FCBE (Yellow Mana), #005946 (Evergreen), #4D0B25 (What We Do in the Shadows). It mixes green, purple, turquoise, yellow, red tones and feels balanced overall. The strongest text pairing is #F8FCBE on #4D0B25 with a contrast ratio of 14.14:1, and 5 of its 15 color pairs pass WCAG AA for normal text.
Color codes
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Sour Lime | rgb(187, 195, 0) | hsl(62, 100%, 38%) | |
| Dreamscape Purple | rgb(146, 67, 226) | hsl(270, 73%, 57%) | |
| Silken Jade | rgb(0, 168, 157) | hsl(176, 100%, 33%) | |
| Yellow Mana | rgb(248, 252, 190) | hsl(64, 91%, 87%) | |
| Evergreen | rgb(0, 89, 70) | hsl(167, 100%, 17%) | |
| What We Do in the Shadows | rgb(77, 11, 37) | hsl(336, 75%, 17%) |
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.
- Aa14.14:1 #F8FCBE on #4D0B25
- Aa14.14:1 #4D0B25 on #F8FCBE
- Aa7.85:1 #BBC300 on #4D0B25
- Aa7.85:1 #4D0B25 on #BBC300
- Aa7.81:1 #F8FCBE on #005946
- Aa7.81:1 #005946 on #F8FCBE
- Aa5.10:1 #00A89D on #4D0B25
- Aa5.10:1 #4D0B25 on #00A89D
Color blindness preview
- Protanopia
- Deuteranopia
- Tritanopia
- Achromatopsia
- Dog vision
CSS variables
/* Sour Lime to What We Do in the Shadows — https://swatchly.xyz/palette/bbc300-9243e2-00a89d-f8fcbe-005946-4d0b25 */
:root {
--sour-lime: #bbc300;
--dreamscape-purple: #9243e2;
--silken-jade: #00a89d;
--yellow-mana: #f8fcbe;
--evergreen: #005946;
--what-we-do-in-the-shadows: #4d0b25;
}
Tailwind CSS v4
/* Sour Lime to What We Do in the Shadows — https://swatchly.xyz/palette/bbc300-9243e2-00a89d-f8fcbe-005946-4d0b25 */
@theme {
--color-sour-lime: #bbc300;
--color-sour-lime-50: #f1f9a9;
--color-sour-lime-100: #e6ee93;
--color-sour-lime-200: #d2da6a;
--color-sour-lime-300: #bbc300;
--color-sour-lime-400: #9da400;
--color-sour-lime-500: #838800;
--color-sour-lime-600: #696e00;
--color-sour-lime-700: #545800;
--color-sour-lime-800: #424500;
--color-sour-lime-900: #343600;
--color-sour-lime-950: #202200;
--color-dreamscape-purple: #9243e2;
--color-dreamscape-purple-50: #f7f3ff;
--color-dreamscape-purple-100: #f1e9ff;
--color-dreamscape-purple-200: #e3d2ff;
--color-dreamscape-purple-300: #d3b7ff;
--color-dreamscape-purple-400: #bd8cff;
--color-dreamscape-purple-500: #ab61fe;
--color-dreamscape-purple-600: #9243e2;
--color-dreamscape-purple-700: #7728c0;
--color-dreamscape-purple-800: #60129f;
--color-dreamscape-purple-900: #4b0280;
--color-dreamscape-purple-950: #300055;
--color-silken-jade: #00a89d;
--color-silken-jade-50: #e0fffb;
--color-silken-jade-100: #bcfff7;
--color-silken-jade-200: #9ef0e6;
--color-silken-jade-300: #7cddd3;
--color-silken-jade-400: #49c1b6;
--color-silken-jade-500: #00a89d;
--color-silken-jade-600: #00877e;
--color-silken-jade-700: #006b64;
--color-silken-jade-800: #00534d;
--color-silken-jade-900: #00403b;
--color-silken-jade-950: #002724;
--color-yellow-mana: #f8fcbe;
--color-yellow-mana-50: #f8fcbe;
--color-yellow-mana-100: #edf0cb;
--color-yellow-mana-200: #d9dcb0;
--color-yellow-mana-300: #c3c694;
--color-yellow-mana-400: #a4a76f;
--color-yellow-mana-500: #888b51;
--color-yellow-mana-600: #6e7038;
--color-yellow-mana-700: #575925;
--color-yellow-mana-800: #444517;
--color-yellow-mana-900: #34350d;
--color-yellow-mana-950: #202105;
--color-evergreen: #005946;
--color-evergreen-50: #dafff2;
--color-evergreen-100: #cbf7e7;
--color-evergreen-200: #b0e5d3;
--color-evergreen-300: #95d2bd;
--color-evergreen-400: #71b59f;
--color-evergreen-500: #549b85;
--color-evergreen-600: #39816d;
--color-evergreen-700: #256b58;
--color-evergreen-800: #005946;
--color-evergreen-900: #084436;
--color-evergreen-950: #012c22;
--color-what-we-do-in-the-shadows: #4d0b25;
--color-what-we-do-in-the-shadows-50: #fff1f4;
--color-what-we-do-in-the-shadows-100: #ffe3e9;
--color-what-we-do-in-the-shadows-200: #ffc6d3;
--color-what-we-do-in-the-shadows-300: #f0abbc;
--color-what-we-do-in-the-shadows-400: #d1869a;
--color-what-we-do-in-the-shadows-500: #b3687d;
--color-what-we-do-in-the-shadows-600: #934d61;
--color-what-we-do-in-the-shadows-700: #75384a;
--color-what-we-do-in-the-shadows-800: #5a2736;
--color-what-we-do-in-the-shadows-900: #4d0b25;
--color-what-we-do-in-the-shadows-950: #290d16;
}
Similar palettes
- 529D4C38194590D356314B00FEEEFF9646D1Golf Course to Dreamscape Purple
- A0459D00636E00AAAE511B6CD3A400FFD292Vicious Violet to Sunbathed Beach
- E9EAA9EDA5A700A99F6646B43B3C763E1D1FPollen to Bruised Plum
- 8DC383341B29A75A8BDBF0C7005E5AExhilarating Green to Mosque
- E0FFCB2E1D2F9BC492004B4AAB323B48ABB7Herbal Vapours to Thalassa
- 391D63006B49985FE060D57CFFE9EADark Dreams to Pink Lemonade
- 53346E653AA67D5FB48CB15CACC900E1FAC8Purple Protégé to Herbal Vapours
- C2F2D4976282165E4B00C79D321929Mystery Mint to Black Cherry