CSS gradient generator

Pick colors. Copy CSS. Done.

background: linear-gradient(135deg, #6366F1, #EC4899);
Presets
Type
Colors
Color 1
Color 2
Angle135°

Free CSS gradient generator

GradientLab creates beautiful CSS gradients visually. Pick two colors, adjust the angle, and copy the CSS code. Supports both linear and radial gradients. Browse 12 handpicked presets or randomize for inspiration. Works with any CSS framework including Tailwind CSS. All code generated locally in your browser.