ColorPaletteXYZ Logo
ColorPaletteXYZ
Palettes/Sunset· Curated

Malibu Dusk Glow

Lush twilight gradient palette capturing the radiant evening sky over Pacific horizons.

#Sunset#Gradient#Creative#Warm
Open in Generator
COLOR 1
#2B0938
Concord Grape
COLOR 2
#6A0572
Purple
COLOR 3
#AB2E64
Dark Raspberry
COLOR 4
#D85A52
Jasper Red
COLOR 5
#F9A03F
Ripe Papaya

Suitable Design Applications

Consumer Lifestyle AppsWellness & Meditation PlatformsCreative Portfolio HeadersMusic Streaming UI

Visual Psychology & Mood

Evokes serene Pacific coast sunsets, tranquility, creative inspiration, and warmth.

Editorial Application Advice

Pairs warm dusk rose with twilight violet. Perfect for luminous hero gradients and ambient card borders against dark charcoal backdrops.

Recommended UI Role Architecture

Optimal visual hierarchy assignment for digital product interfaces:

Primary Canvas Background
#0A0D14
Card & Elevated Surface
#161B26
Primary Brand CTA Accent
#F43F5E
Secondary Accent & Focus
#A855F7
Typography & Headings
#F8FAFC

Color Values & Codes

HEX · RGB · HSL
rgb(43, 9, 56)hsl(283, 72%, 13%)Color details →
Purple
#6A0572
rgb(106, 5, 114)hsl(296, 92%, 23%)Color details →
rgb(171, 46, 100)hsl(334, 58%, 43%)Color details →
Jasper Red
#D85A52
rgb(216, 90, 82)hsl(4, 63%, 58%)Color details →
rgb(249, 160, 63)hsl(31, 94%, 61%)Color details →

Open In Design Tools

Palette Generator
Lock & shuffle colors
Contrast Checker
Test WCAG compliance
Shades & Tints
Generate tonal steps
Sunset Palettes
Explore category schemes

CSS Variables

Copy & paste directly into your stylesheet
:root {
  --color-1: #2B0938;
  --color-2: #6A0572;
  --color-3: #AB2E64;
  --color-4: #D85A52;
  --color-5: #F9A03F;
}

Role-Based WCAG Contrast Audit

Accessibility contrast depends on assigned UI roles. Here are the contrast ratios and WCAG compliance ratings when pairing palette colors as Foreground Text against Background surfaces:

Sample Text
#2B0938 on #D85A524.59:1
Normal Text AA Pass
Sample Text
#2B0938 on #F9A03F8.45:1
Normal Text AA Pass
Sample Text
#6A0572 on #D85A522.93:1
Large Text Only (Fail)
Sample Text
#6A0572 on #F9A03F5.39:1
Normal Text AA Pass
Sample Text
#AB2E64 on #D85A521.66:1
Large Text Only (Fail)
Sample Text
#AB2E64 on #F9A03F3.06:1
Large Text Only (Pass)

Related Palettes in Sunset

Explore Sunset
#E76F51Copy
#F4A261Copy
#E9C46ACopy
#2A9D8FCopy
#264653Copy
cp-featured-03Vintage
1970s California Sun
VintageRetroWarm
#180F33Copy
#491F79Copy
#7C3AEDCopy
#A78BFACopy
#F5F3FFCopy
cp-featured-05App UI
Fluid iOS Violet
App UICreative
#FFFFFFCopy
#F4F4F5Copy
#A1A1AACopy
#27272ACopy
#E11D48Copy
cp-featured-07Minimal
Swiss Editorial Clean
MinimalCreativeBold
#231612Copy
#48281DCopy
#784534Copy
#B87E60Copy
#E4CEBACopy
cp-featured-09Food
Artisan Espresso Roast
FoodWarmEarthy

Frequently Asked Questions About Malibu Dusk Glow

Production design guidance and accessibility rules for applying the Malibu Dusk Glow (Sunset) color palette.

What is the recommended role hierarchy for the Malibu Dusk Glow palette?
In digital interface design, allocate #2B0938 and #F9A03F for structural surface canvas and typography hierarchy (the 60% and 30% layers of the design), while using standout swatches like #6A0572 or #AB2E64 as your 10% primary action accent for buttons, badges, and interactive highlights.
Are the colors in Malibu Dusk Glow WCAG accessible for web body copy?
Always verify contrast ratios against WCAG 2.2 AA standards (minimum 4.5:1 for regular body copy and 3.0:1 for large text or graphical controls). Consult the Role-Based WCAG Contrast Audit section above to see exact scores for every foreground/background combination in this palette.
How can I export the Malibu Dusk Glow palette to my frontend codebase?
You can copy CSS Custom Properties directly from the CSS Variables code block above, export Tailwind CSS configuration tokens, download a high-resolution PNG card, or open the entire palette inside the interactive Palette Generator to experiment with tints and harmonies.