Sunset Color Palette
A warm sunset color palette with hex codes — deep orange, golden amber, coral pink, and burnished violet. Ready to copy or open in PhotoTones.
A sunset color palette captures Peach Glow, Sunset Orange, Horizon Red, and 3 more coordinated tones — ready-to-copy hex codes for web design, branding, UI themes, and creative projects.
- Peach Glow#FFB16Crgb(255, 177, 108)hsl(28, 100%, 71%)
- Sunset Orange#F97316rgb(249, 115, 22)hsl(25, 95%, 53%)
- Horizon Red#DC2626rgb(220, 38, 38)hsl(0, 72%, 51%)
- Dusk Magenta#9D174Drgb(157, 23, 77)hsl(336, 74%, 35%)
- Deep Violet#4C1D95rgb(76, 29, 149)hsl(264, 67%, 35%)
- Night Indigo#1E1B4Brgb(30, 27, 75)hsl(244, 47%, 20%)
Use this palette
Copy all hex codes or build a custom palette from your own photo in under 1 second.
Hex Codes at a Glance
#FFB16C, #F97316, #DC2626, #9D174D, #4C1D95, #1E1B4B
Get More with Pro
Download the Sunset sample, then unlock every gallery kit
Hex, RGB, and HSL stay free above. PhotoTones Pro is $7/month for this Sunset brand kit and every other gallery brand kit, plus kits from your own images.
- brand-guide.htmlPrint-ready visual guide
- tokens/W3C, Tokens Studio, Style Dictionary
- code/Tailwind, SCSS, CSS, light/dark themes
- figma/Variables + Tokens Studio JSON
- preview/Swatch PNG, plus composite for image kits
How to Use This Palette
- In CSS: Paste each hex into your
:rootcustom properties or directly intobackground-color/colordeclarations. - In Figma or Sketch: Copy the hex into any fill or stroke color field. Save each color to your local style library for reuse across frames.
- In Tailwind CSS: Add each hex to your
tailwind.config.jsfile insidetheme.extend.colors, then use classes likebg-palette-500. - In Procreate or Photoshop: Create a new swatch set and paste each hex value, or use the brand kit above for ready-to-import
.swatchesand.asefiles.
Build Your Own Palette
This sunset palette is one of many themed palettes in the PhotoTones gallery. To build a palette from your own photo, use the free PhotoTones color palette from image generator — it extracts up to 12 hex codes per image in under a second, entirely in your browser. No signup required.
Related Palettes
Frequently Asked Questions
What hex codes are in a sunset color palette?
This sunset palette includes #FFB16C, #F97316, #DC2626, #9D174D, #4C1D95, #1E1B4B. Copy any hex directly for CSS, Figma, Tailwind, or mood board projects.
How do I use a sunset palette in web design?
Use vibrant tones for primary actions, muted tones for backgrounds, and dark tones for text. Upload your own sunset-inspired photo to PhotoTones to extract a custom palette in under 1 second.
Can I build a custom sunset palette from my own photo?
Yes. Open phototones.com, upload a sunset-inspired image, and click Generate Color Palette. PhotoTones extracts up to 6 colors free (12 on Pro), entirely in your browser with no upload.
Can I download this sunset palette as ASE, Figma Variables, or a brand kit?
Yes. This Sunset palette includes a free sample brand kit with Adobe ASE, Figma Variables, design tokens, Tailwind, CSS, theme files, and WCAG pairings. Hex, RGB, and HSL stay free. PhotoTones Pro is $7/month for this kit and every other gallery brand kit.