ZentaKit — online developer toolsZentaKitzentakit.com

CSS Linear-Gradient Generator

Generate CSS gradient snippets.

Color stops

Presets

Preview

CSS

background: linear-gradient(135deg, #34d399, #0f172a);

How to use

Pick start/end stops with HEX or the color inputs. The angle slider maps to `linear-gradient` direction (e.g., 90deg horizontal, 180deg downward); the preview mirrors the result.

Copy CSS emits a single `background: linear-gradient(...);` declaration—append `background-size` / `background-repeat` manually if needed.

This generator focuses on two-stop linear gradients; extend the snippet by hand for extra stops or radial patterns.

Gradient CSS — linear-gradient Code & Preview (Free) | ZentaKit