Halloween Color Palette
Halloween palettes start from pumpkin orange and black, then add a poison purple or slime green for a third note. Off-white “bone” keeps them readable and stops them going muddy.
See it on a page
Lightest color becomes the background, darkest the text, the most saturated one the button.
Ship the release notes your users actually read.
Body text in your darkest color on your lightest: 16.13:1 AA pass
Export
CSS custom properties, Tailwind v4 @theme (in OKLCH), Tailwind v3 config, JSON or SCSS.
:root {
--color-black: #120E14;
--color-dark-slate-gray: #3A2A3F;
--color-coral: #F27A1A;
--color-orange: #FFB347;
--color-antique-white: #F4EBD9;
}Contrast between every pair
WCAG 2.2: 4.5:1 for body text (AA), 3:1 for large text and UI parts, 7:1 for AAA.
| Text / background | #120E14 | #3A2A3F | #F27A1A | #FFB347 | #F4EBD9 |
|---|---|---|---|---|---|
| #120E14 | Aa1.44:1Fail | Aa6.89:1AA | Aa10.73:1AAA | Aa16.13:1AAA | |
| #3A2A3F | Aa1.44:1Fail | Aa4.78:1AA | Aa7.44:1AAA | Aa11.20:1AAA | |
| #F27A1A | Aa6.89:1AA | Aa4.78:1AA | Aa1.55:1Fail | Aa2.34:1Fail | |
| #FFB347 | Aa10.73:1AAA | Aa7.44:1AAA | Aa1.55:1Fail | Aa1.50:1Fail | |
| #F4EBD9 | Aa16.13:1AAA | Aa11.20:1AAA | Aa2.34:1Fail | Aa1.50:1Fail |
Get an AI critique of this palette
The contrast numbers are calculated exactly in your browser and passed to the AI, so its advice starts from real ratios.
Hand-picked halloween palettes
Pumpkin patch
16.13:1 text contrast · Edit in generatorWitching hour
15.95:1 text contrast · Edit in generatorVintage Halloween
13.86:1 text contrast · Edit in generatorTips for halloween palettes
- Use a near-black with a purple tint instead of pure #000.
- Orange on black passes contrast well; purple on black usually does not.
- One acid green accent is enough; it overwhelms in large areas.
Want one written for your project? Describe it on the AI palette generator, then check it with the accessible palette checker.
Frequently asked questions
What are the colors of Halloween?
Orange and black are the traditional pair, with purple, green and white as secondary colors.
What hex code is pumpkin orange?
There is no standard; values between #F27A1A and #FF7518 are common. Check contrast if you put text on it: dark text usually works better than white.
How do I make a Halloween palette that is not too dark?
Use bone white or parchment as the background and keep black for headings and borders.