Free browser tool

Gradient Generator

Create linear or radial CSS gradients with editable stops and angle.

First stop

Second stop

Angle · 125° Radial gradient

background: linear-gradient(125deg, #725CFF, #FF6D73);

What this helps you decide

Choose the direction and blend that support a surface without obscuring its content.

Use it for hero backgrounds, illustrations, and subtle depth. Copy the CSS only after checking text contrast over the final gradient.