CSS Gradient Generator

Build a gradient with a live preview, then copy the CSS.

Click the bar to add a stop · drag to move · click to select

Selected color Position %

Type Angle °

About this tool

A CSS gradient blends colours across a background.

A colour stop is a colour pinned to a position.