Copper Patina CSS Gradient

A copper, teal, rust 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-image: conic-gradient(from 200deg, oklch(0.712 0.098 186.676), oklch(0.566 0.101 182.454), oklch(0.536 0.18 35.371), oklch(0.45 0.049 39.211), oklch(0.712 0.098 186.676));

The colors

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

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.