Sunset Color Palette: Hex Codes, RGB Values & Design Examples
Copy sunset color palettes hex codes—orange #F97316, red #EF4444, pink #EC4899, purple #8B5CF6—and matching sunset colors rgb values for UI, social, and brand systems.
Orange
Red
Pink
Purple
Amber
Sunset palette — 5 core codes
Copy sunset hex codes and sunset rgb values for the anchors most brands use in heroes and CTAs.
A sunset color palette moves from golden amber through ember red and twilight pink into violet—mimicking the sky, not a single swatch. Teams search for sunset hex codes and sunset color palette codes when they need copy-ready values for gradients, event posters, and product UI. Document both hex and RGB so engineers, motion designers, and print vendors stay aligned.
Sunset Color Palette Hex Codes
Ten sunset stops from dawn cream to deep violet. Use light rows for backgrounds; saturated rows for buttons, badges, and gradient heroes.
| Swatch | Shade | Hex |
|---|---|---|
| Dawn cream | #FFFBEB | |
| Soft amber | #FDE68A | |
| Amber | #F59E0B | |
| Sunset orange | #F97316 | |
| Burnt orange | #EA580C | |
| Ember red | #EF4444 | |
| Deep red | #DC2626 | |
| Twilight pink | #EC4899 | |
| Violet | #8B5CF6 | |
| Deep violet | #6D28D9 |
Sunset RGB Values
Android resources, video overlays, and design handoffs often need a sunset rgb code instead of hex. The table below lists the same sunset colors rgb pairs—orange rgb(249, 115, 22), pink rgb(236, 72, 153), purple rgb(139, 92, 246)—alongside hex for quick reference.
| Swatch | Color | Hex | RGB |
|---|---|---|---|
| Dawn cream | #FFFBEB | rgb(255, 251, 235) | |
| Amber | #F59E0B | rgb(245, 158, 11) | |
| Sunset orange | #F97316 | rgb(249, 115, 22) | |
| Ember red | #EF4444 | rgb(239, 68, 68) | |
| Twilight pink | #EC4899 | rgb(236, 72, 153) | |
| Violet | #8B5CF6 | rgb(139, 92, 246) | |
| Deep violet | #6D28D9 | rgb(109, 40, 217) | |
| Burnt orange | #EA580C | rgb(234, 88, 12) | |
| Deep red | #DC2626 | rgb(220, 38, 38) | |
| Soft amber | #FDE68A | rgb(253, 230, 138) |
Sunset Color Palette Combinations
Four four-color sunset palettes for campaigns, dashboards, and editorial sites—each with swatches and hex labels.
Classic sunset gradient
Hero band from #F97316 through #EC4899 to #8B5CF6; charcoal (#111827) type on white below.
- Orange: #F97316
- Red: #EF4444
- Pink: #EC4899
- Purple: #8B5CF6
Warm editorial
Amber #F59E0B headlines, cream #FFFBEB body wells, ember red #EF4444 CTAs.
- Amber: #F59E0B
- Cream: #FFFBEB
- Red: #EF4444
- Charcoal: #374151
Festival energy
Deep violet #6D28D9 navigation, pink #EC4899 badges, orange #F97316 primary buttons on black.
- Violet: #6D28D9
- Pink: #EC4899
- Orange: #F97316
- Near black: #0F0F0F
Soft lifestyle
Dawn cream backgrounds, burnt orange #EA580C accents, slate #64748B secondary text.
- Cream: #FFFBEB
- Burnt orange: #EA580C
- Pink: #EC4899
- Slate: #64748B
Sunset Colors in UI and Brand Design
Music and events. Gradient heroes from #F97316 through #EC4899 to #8B5CF6 signal energy immediately—keep ticket flows and account settings in charcoal on white so users can complete tasks without visual fatigue.
Travel and lifestyle. Amber #F59E0B and burnt orange #EA580C work for ratings and highlights; reserve deep violet #6D28D9 for navigation chrome in dark mode.
Dashboards. Neutrals should dominate; use sunset hues only for KPI deltas, alerts, and marketing modules. Run every text-on-sunset pair through the contrast checker.
Seed orange #F97316 in the palette generator to export harmonized tints, then blend accents in the color mixer when you need custom sunset transitions between pink and purple.
FAQ
- What are the main sunset color palette hex codes?
- Core sunset hex codes are #F97316 (orange), #EF4444 (red), #EC4899 (pink), #8B5CF6 (purple), and #F59E0B (amber). Use them for CTAs, gradients, and accents—not small body text without contrast testing.
- What is the sunset rgb code for orange?
- Sunset orange #F97316 is rgb(249, 115, 22). Pink #EC4899 is rgb(236, 72, 153) and purple #8B5CF6 is rgb(139, 92, 246). Copy RGB rows from the Sunset RGB Values table on this page.
- What colors go in a sunset color palette?
- Pair warm sunset hues with charcoal (#111827), cream (#FFFBEB), or cool slate (#64748B) for readable UI. Limit three saturated primaries per screen for clear hierarchy.
- Is a sunset palette good for websites?
- Yes for lifestyle, events, music, travel, and creative brands. Keep long-form copy on neutrals, use sunset colors for heroes and buttons, and verify WCAG contrast for every text-on-color pair.
Build your sunset palette
Mix warm hues or generate a full ramp for your brand.
Related: Sunset Vibes Palette · Terracotta Hex Code · Purple Dream Palette