Halloween Color Palette — HEX Codes, Swatches & UI Palette
Classic autumn gothic fun featuring glowing pumpkin orange, eerie toxic slime green, mystical witchcraft purple, and deep midnight obsidian. Built for seasonal campaigns and eerie gaming assets.
Color Swatches & Technical Specifications
Exact color codes, luminance values, and WCAG contrast ratings for each swatch in the Halloween Color Palette.
UI Design & Color Hierarchy Guide
High-contrast visual hierarchy is key: use pumpkin orange (#FF7518) on jet black surfaces for maximum punch. Add toxic green (#88D436) for interactive hover states and spooky flair.
WCAG 2.1 Accessibility & Contrast Matrix
Legibility ratings between palette elements and key backgrounds (Lightest: Ghostly Bone White | Darkest: Pitch Black):
| Swatch | Contrast vs Light Canvas | Contrast vs Dark Canvas |
|---|---|---|
| Pumpkin Orange (#FF7518) | 2.54:1 Fail | 6.48:1 AA |
| Witchcraft Purple (#663399) | 7.95:1 AAA | 2.07:1 Fail |
| Toxic Slime Green (#88D436) | 1.72:1 Fail | 9.55:1 AAA |
| Pitch Black (#1A1A1A) | 16.47:1 AAA | 1.0:1 Fail |
| Ghostly Bone White (#F8F8FF) | 1.0:1 Fail | 16.47:1 AAA |
CSS Custom Properties & Design Tokens
Copy and paste production-ready tokens directly into your CSS stylesheet or Tailwind CSS configuration:
:root {
--color-1: #FF7518; /* Pumpkin Orange - Iconic Halloween CTA */
--color-2: #663399; /* Witchcraft Purple - Mystic Shadow Accent */
--color-3: #88D436; /* Toxic Slime Green - Eerie Highlight */
--color-4: #1A1A1A; /* Pitch Black - Dark Canvas Surface */
--color-5: #F8F8FF; /* Ghostly Bone White - Spectral High Contrast */
}{
colors: {
'palette-1': '#FF7518',
'palette-2': '#663399',
'palette-3': '#88D436',
'palette-4': '#1A1A1A',
'palette-5': '#F8F8FF'
}
}Explore More Curated Color Palettes
Browse seasonal palettes, retro aesthetic color schemes, nature tones, and dark mode themes.