Warm Color Palette
Energetic · Welcoming · Vivid
A cohesive warm palette spanning reds, oranges, and golden yellows. Warm colours advance visually, creating a sense of energy and immediacy. They naturally draw the eye and create a welcoming, energetic atmosphere.
| Swatch | Name | Hex |
|---|---|---|
| Warm 50 | #FFF3E0 | |
| Amber | #FFD54F | |
| Orange | #FF9800 | |
| Red | #F44336 | |
| Pink Red | #E91E63 | |
| Deep Purple | #7B1FA2 |
Best For
Pair warm tones with neutral white or cream backgrounds. Use the deepest red as the primary brand colour, orange as an accent, and yellow for highlights and decorative elements.
CSS Custom Properties
:root {
--warm-100: #FFF3E0;
--warm-200: #FFD54F;
--warm-300: #FF9800;
--warm-400: #F44336;
--warm-500: #E91E63;
--warm-600: #7B1FA2;
}Tailwind CSS Config
// tailwind.config.ts
export default {
theme: {
extend: {
colors: {
"warm": {
"100": "#FFF3E0",
"200": "#FFD54F",
"300": "#FF9800",
"400": "#F44336",
"500": "#E91E63",
"600": "#7B1FA2",
},
},
},
},
}Generate a custom palette
Enter any seed colour and generate complementary, analogous, triadic, and monochromatic palettes. Export as CSS variables, Tailwind config, or JSON.
Open Color Palette GeneratorFrequently Asked Questions
What hex codes are in the Warm Color Palette?
The Warm Color Palette includes: Warm 50 (#FFF3E0), Amber (#FFD54F), Orange (#FF9800), Red (#F44336), Pink Red (#E91E63), Deep Purple (#7B1FA2).
What is the mood of the Warm Color Palette?
Warm Color Palette evokes: Energetic · Welcoming · Vivid. A cohesive warm palette spanning reds, oranges, and golden yellows. Warm colours advance visually, creating a sense of energy and immediacy. They naturally draw the eye and create a welcoming, energetic atmosphere.
What industries use the Warm Color Palette?
The Warm Color Palette is popular in: Food & Beverage, Hospitality, Retail, Entertainment. Pair warm tones with neutral white or cream backgrounds. Use the deepest red as the primary brand colour, orange as an accent, and yellow for highlights and decorative elements.
What colours pair well with this palette?
This palette pairs well with: white, cream, dark-brown. Pair warm tones with neutral white or cream backgrounds. Use the deepest red as the primary brand colour, orange as an accent, and yellow for highlights and decorative elements.
