Skip to content
littlekit.app
All tools

Gradient generator

Design linear and radial gradients with color stops and an immediate preview.

HEX, RGB or HSL · alpha supported
HEX, RGB or HSL · alpha supported
Middle color stop
Generated CSS
background: linear-gradient(120deg, rgb(15 118 110) 0%, rgb(199 210 254) 100%);
Processed on your device

How it works & useful details

How to use this tool

Choose your start and end colors, direction and gradient type. Add a middle stop for more control.

Supported values and limitations

Exports CSS background declarations with two or three color stops. Alpha is preserved; the checkerboard underneath represents transparency and is not exported. Linear angles follow CSS: 0° points up and 90° points right.