CSS Gradient

Build a ready-to-paste CSS linear-gradient from two colors and an angle. Copy the one-line background declaration straight into your stylesheet — no plugin needed.

Try it now

Worked example

CSS: background: linear-gradient(135deg, #4ade80, #38bdf8);

Learn the method

Inputs

Color 1
#4ade80
Color 2
#38bdf8
Angle (deg)
135

Frequently asked

What does the angle mean?

The gradient direction in degrees; 135deg runs from the top-left toward the bottom-right.

Can I use more than two colors?

This builder uses two stops for clean, reliable output; add extra stops by hand if needed.