Midnight Prism CSS Gradient

A dark, neon, prism conic 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.123 0.027 281.723);
background-image: conic-gradient(from 0deg, oklch(0.637 0.249 20.732), oklch(0.514 0.285 284.294), oklch(0.844 0.146 209.285), oklch(0.81 0.214 151.769), oklch(0.925 0.194 102.891), oklch(0.637 0.249 20.732));

The colors

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

#050510 Breakdown
#ff1644 Breakdown
#651eff Breakdown
#00e5ff Breakdown
#01e676 Breakdown
#ffea04 Breakdown

Tags:dark neon prism Conic

Related gradients

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.