Kiln & Cosmos

Warm amber light bleeding into deep indigo dusk, where fiery warmth meets cool starlit depth.

Open in generator

Colors

~Orange Delight#FFC15C

~Peach Fizz#FFAB8A

~Sky Dancer#3D9BFF

~Frosted Blueberries#1A47E0

~Void#050A24

Psychology

The palette pairs advancing warm tones (orange and peach) against receding cool dominants (vivid and deep blues), creating dynamic visual tension that commands attention without overwhelming. The high contrast between the luminous yellows and the near-black void triggers alertness and visual engagement, while the blue majority anchors the energy with cooler, more contemplative undertones. This complementary relationship leverages color theory's principle that warm and cool opposites intensify each other, generating bold impact suitable for projects demanding presence and sophistication.

Usage

Apply to luxury tech product interfaces, editorial magazine spreads, and high-end beverage packaging where warm accent details draw focus against deep blue or near-black backgrounds. The palette excels in projects requiring high-contrast hierarchy and visual depth, from fintech app design to premium cosmetics branding that balances approachability (warm tones) with authority (deep blues).
Fashion lookbooks and architectural visualization benefit from this combination's ability to suggest both warmth and sophistication 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,
    #ffc15c 0%,
    #ffab8a 25%,
    #3d9bff 50%,
    #1a47e0 75%,
    #050a24 100%
  );

Tailwind v4

/* app.css — Tailwind v4 */
@theme {
  --color-gradient-1: #ffc15c;
  --color-gradient-2: #ffab8a;
  --color-gradient-3: #3d9bff;
  --color-gradient-4: #1a47e0;
  --color-gradient-5: #050a24;
}

/* Usage: bg-gradient-1, text-gradient-2, etc. */

CSS Variables

--color-1: #ffc15c;
--color-2: #ffab8a;
--color-3: #3d9bff;
--color-4: #1a47e0;
--color-5: #050a24;

Hex values

#ffc15c, #ffab8a, #3d9bff, #1a47e0, #050a24

Building something? Get this palette via the REST API.

History

Similar palettes

Abyssal Hearth

Midnight Brass

Indigo Hour Study

Slate & Honey Hour

Buttercream Lagoon

Teal Linen Afternoon

Blackberry Bakery Noon

Porcelain Drift

Caramel Linen Hour