Magma Core CSS Gradient

A red, orange, heat radial gradient you can drop into any project. Copy the CSS below and use it as a background for hero sections, cards, buttons, or full pages.

The CSS

background-color: oklch(0.155 0.039 22.841);
background-image: radial-gradient(circle at 50% 50%, oklch(0.705 0.193 39.231) 0%, oklch(0.516 0.202 25.943) 35%, oklch(0.223 0.08 15.742) 70%, oklch(0.155 0.039 22.841) 100%);

The colors

The colors this gradient blends between. Open any of them for a full breakdown — shades, harmonies, and contrast.

Tags:redorangeheatRadial

Related gradients

Ember Glow
Warm Flame
Warm Tones
Sunset Burst
Wine Glass
Sunrise Sweep
Magma Ring
Ice & Fire

More gradient tools

Browse the full gallery of CSS gradients, build animated backgrounds with the Shader Maker, or generate soft multi-color backgrounds with the Mesh Gradient Generator.