Orange Color Palette
Enthusiasm · Warmth · Creativity
A vibrant orange palette from pale peach to deep burnt sienna. Orange combines the energy of red with the warmth of yellow — stimulating enthusiasm, creativity, and appetite. Popular in food, tech startups, and sports branding.
| Swatch | Name | Hex |
|---|---|---|
| Orange 50 | #FFF7ED | |
| Orange 200 | #FED7AA | |
| Orange 400 | #FB923C | |
| Orange 500 | #F97316 | |
| Orange 700 | #C2410C | |
| Sienna | #7C2D12 |
Best For
Use saturated oranges for CTAs and highlights. Muted oranges (terracotta) work beautifully in warm lifestyle brand identities. Pair with white or cream backgrounds for a clean look.
CSS Custom Properties
:root {
--orange-100: #FFF7ED;
--orange-200: #FED7AA;
--orange-300: #FB923C;
--orange-400: #F97316;
--orange-500: #C2410C;
--orange-600: #7C2D12;
}Tailwind CSS Config
// tailwind.config.ts
export default {
theme: {
extend: {
colors: {
"orange": {
"100": "#FFF7ED",
"200": "#FED7AA",
"300": "#FB923C",
"400": "#F97316",
"500": "#C2410C",
"600": "#7C2D12",
},
},
},
},
}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 Orange Color Palette?
The Orange Color Palette includes: Orange 50 (#FFF7ED), Orange 200 (#FED7AA), Orange 400 (#FB923C), Orange 500 (#F97316), Orange 700 (#C2410C), Sienna (#7C2D12).
What is the mood of the Orange Color Palette?
Orange Color Palette evokes: Enthusiasm · Warmth · Creativity. A vibrant orange palette from pale peach to deep burnt sienna. Orange combines the energy of red with the warmth of yellow — stimulating enthusiasm, creativity, and appetite. Popular in food, tech startups, and sports branding.
What industries use the Orange Color Palette?
The Orange Color Palette is popular in: Food & Beverage, Sports, Technology Startups, Retail. Use saturated oranges for CTAs and highlights. Muted oranges (terracotta) work beautifully in warm lifestyle brand identities. Pair with white or cream backgrounds for a clean look.
What colours pair well with this palette?
This palette pairs well with: white, cream, brown. Use saturated oranges for CTAs and highlights. Muted oranges (terracotta) work beautifully in warm lifestyle brand identities. Pair with white or cream backgrounds for a clean look.