CSS gradient generator

Pick two or three colours, the shape and the angle, and copy the CSS — with a solid colour first as the fallback. The preview is that same CSS.

LinearRadialConic

Angle135°Colour 1#6b51b8Colour 2#e8c547Third colourColour 3#3e93ad

Output · CSS

Waiting for input

Runs in this tab. The text is not sent anywhere.

Questions

Do gradients work in every browser?

Linear and radial ones everywhere in use today; conic since 2020. The solid background-color line covers anything older.