Red Color Palette
Energy · Urgency · Passion
A bold red palette from soft blush tones to deep crimson. Red is the most attention-grabbing colour — conveying energy, urgency, passion, and power. Widely used for CTAs, alerts, and brands that want to command attention.
| Swatch | Name | Hex |
|---|---|---|
| Rose 50 | #FFF1F2 | |
| Rose 200 | #FECDD3 | |
| Rose 400 | #FB7185 | |
| Red 500 | #EF4444 | |
| Red 700 | #B91C1C | |
| Crimson | #7F1D1D |
Best For
Use deep reds for primary action buttons and brand accents. Light tints work well for error state backgrounds. Avoid full red backgrounds for large areas — use sparingly for maximum impact.
CSS Custom Properties
:root {
--red-100: #FFF1F2;
--red-200: #FECDD3;
--red-300: #FB7185;
--red-400: #EF4444;
--red-500: #B91C1C;
--red-600: #7F1D1D;
}Tailwind CSS Config
// tailwind.config.ts
export default {
theme: {
extend: {
colors: {
"red": {
"100": "#FFF1F2",
"200": "#FECDD3",
"300": "#FB7185",
"400": "#EF4444",
"500": "#B91C1C",
"600": "#7F1D1D",
},
},
},
},
}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 Red Color Palette?
The Red Color Palette includes: Rose 50 (#FFF1F2), Rose 200 (#FECDD3), Rose 400 (#FB7185), Red 500 (#EF4444), Red 700 (#B91C1C), Crimson (#7F1D1D).
What is the mood of the Red Color Palette?
Red Color Palette evokes: Energy · Urgency · Passion. A bold red palette from soft blush tones to deep crimson. Red is the most attention-grabbing colour — conveying energy, urgency, passion, and power. Widely used for CTAs, alerts, and brands that want to command attention.
What industries use the Red Color Palette?
The Red Color Palette is popular in: Food & Beverage, Fashion, Entertainment, Sports. Use deep reds for primary action buttons and brand accents. Light tints work well for error state backgrounds. Avoid full red backgrounds for large areas — use sparingly for maximum impact.
What colours pair well with this palette?
This palette pairs well with: white, black, gold. Use deep reds for primary action buttons and brand accents. Light tints work well for error state backgrounds. Avoid full red backgrounds for large areas — use sparingly for maximum impact.