Linear Gradient Maker

Create and customize CSS linear gradients using a visual palette editor, angle selector, and instant CSS copy features.

← Back to Directory

Gradient Type:

Angle (°):

Color Stop

Position (%)

Color Stop

Position (%)

CSS Output:

background: linear-gradient(90deg, #ff0000 0%, #0000ff 100%);

Tailwind Output with Gradient:

<div className="bg-[linear-gradient(90deg, #ff0000 0%, #0000ff 100%)]"></div>