Mulberry Dusk CSS gradient

Plum haze over a warm horizon. 3 CSS layers on #120616, mixed with screen. Edit it in the studio below, then copy the code.

Gradient Studio couldn't load its presets.

It needs a live connection to CrunchCube. Check your internet connection and reload, or open the studio at crunchcube.in.

CSS gradients · blend modes · Tailwind · 40 presets

Mulberry Dusk,
ready to paste.

Plum haze over a warm horizon. 3 layers mixed with screen. Open it in the editor to tune each layer, then take the code as CSS, Tailwind, SVG or HTML.

Mulberry Dusk CSS

.bg-mulberry {
  background-color: #120616;
  background-image:
    radial-gradient(circle at 25% 30%, rgba(177, 74, 237, 1) 0%, rgba(177, 74, 237, 0) 52%),
    radial-gradient(circle at 75% 25%, rgba(255, 110, 165, 1) 0%, rgba(255, 110, 165, 0) 48%),
    radial-gradient(circle at 55% 95%, rgba(255, 184, 107, 1) 0%, rgba(255, 184, 107, 0) 50%);
  background-blend-mode: screen, screen, screen;
  background-size: cover;
}

Colours in Mulberry Dusk

#120616#B14AED#FF6EA5#FFB86B

Where to use it

Mulberry Dusk is a ambient gradient on a dark base. Use it for dark-mode heroes, app splash screens and video thumbnails, with white or very light text on top.

New to layered gradients? Here's how the CSS works.

More ambient gradients

New games, tools and tutorials

About one short email a week. No spam, one-click unsubscribe.