Christmas Color Palette
Classic Christmas red and green, from bright holly to deep pine, with snow white and a touch of gold. Festive without looking like plastic decorations.
Click any color to copy its HEX code.
Christmas color codes
| Name | HEX | RGB | HSL | |
|---|---|---|---|---|
| Snow | #F7F5F0 | 247, 245, 240 | 43°, 30%, 95% | |
| Gold | #C9A227 | 201, 162, 39 | 46°, 68%, 47% | |
| Holly Red | #D62839 | 214, 40, 57 | 354°, 69%, 50% | |
| Cranberry | #A4161A | 164, 22, 26 | 358°, 76%, 36% | |
| Spruce | #2D6A4F | 45, 106, 79 | 153°, 40%, 30% | |
| Pine | #1F5130 | 31, 81, 48 | 140°, 45%, 22% |
How to use this palette
A simple way to use 6 colors without chaos is the 60-30-10 rule: about 60% of the space in the lightest shade, 30% in a supporting color and 10% in the accent. For this palette that is Snow (#F7F5F0) as the base, Gold (#C9A227) as the supporting color and Holly Red (#D62839) as the accent, with Pine (#1F5130) for text and fine details.
Christmas
A quick preview of the palette with base, text and accent colors.
Holly Red GoldWhere it works
Readable text color pairs
These combinations reach a contrast ratio of at least 4.5:1, the WCAG AA level for normal text, so they are safe for text on websites, posters and invitations.
- Pine on Snow#1F5130 on #F7F5F0 · 8.5:1
- Cranberry on Snow#A4161A on #F7F5F0 · 7.1:1
- Spruce on Snow#2D6A4F on #F7F5F0 · 5.9:1
- Holly Red on Snow#D62839 on #F7F5F0 · 4.6:1
CSS variables
:root {
--snow: #F7F5F0;
--gold: #C9A227;
--holly-red: #D62839;
--cranberry: #A4161A;
--spruce: #2D6A4F;
--pine: #1F5130;
}