Citrine Compass Dawn
Warm cream and electric blue collide in bright afternoon light, suggesting boldness softened by buttery comfort.
Psychology
The vivid blue (#1678fa) functions as a cool anchor against three warm yellow tones, creating complementary contrast that signals attention and clarity. Yellow dominates the palette by mass, generating warmth and approachability, while the blue advances visually and prevents the composition from feeling cloying. This combination triggers both energy and comfort, as high-chroma yellows evoke optimism while the muted butter tones ground the palette in tactile softness.
Usage
Deploy in artisanal food packaging and natural cosmetics branding where warmth signals authenticity without aggression. Ideal for tech startup interfaces and creative agency websites that need visual pop without harshness, as the palette's moderate contrast and light profile maintain legibility while the bold complementary pairing commands attention. Works equally well for editorial layouts and product photography where you need to convey both innovation (blue) and heritage (cream yellows) simultaneously.
Code
CSS Gradient
/* CSS gradient approximation of mesh gradient */
/* Note: This is a linear approximation. For the full animated mesh effect, use the React/JS export. */
background: linear-gradient(
90deg,
#1678fa 0%,
#fdf142 33%,
#fffbd0 67%,
#fffbd0 100%
);Tailwind v4
/* app.css — Tailwind v4 */
@theme {
--color-gradient-1: #1678fa;
--color-gradient-2: #fdf142;
--color-gradient-3: #fffbd0;
--color-gradient-4: #fffbd0;
}
/* Usage: bg-gradient-1, text-gradient-2, etc. */CSS Variables
--color-1: #1678fa; --color-2: #fdf142; --color-3: #fffbd0; --color-4: #fffbd0;
Hex values
#1678fa, #fdf142, #fffbd0, #fffbd0
Building something? Get this palette via the REST API.
History
Similar palettes
Indigo Hour Study
Abyssal Hearth
Roasted Almond Bloom
Slate & Honey Hour
Midnight Brass
Buttercream Lagoon
Blackberry Bakery Noon
Jade Hour Glow
Terracotta Sunrise