Diagonal
Teal to blue at 135°
linear-gradient(135deg, …)
Loading page…ToolStack
Design linear and radial gradients and copy their CSS.
Quick answer
Build a linear or radial two-color CSS gradient with a live preview.
CSS gradient
Illustrative view
Two colors, a shape, and an optional angle create the CSS.
Build a linear or radial two-color CSS gradient with a live preview.
Linear gradients use an angle; radial gradients radiate from the center. The output is valid CSS background syntax.
Teal to blue at 135°
linear-gradient(135deg, …)
White center to black edge
radial-gradient(circle, …)
Yes. Click the generated background declaration to copy it.
Yes. The interface is responsive and works in modern mobile and desktop browsers.
No. This tool runs locally in your browser, so the values or files you provide are not sent to a ToolStack server.
Keep going