Gradient Generator

Create linear or radial gradients visually and get the CSS code.

Type

Angle (°)

Shape

Start Color

End Color

Preview

CSS Code

Features

Create Linear and Radial gradients visually.
Customizable colors and angle/direction.
Real-time preview of the gradient.
Auto-generated CSS code ready to copy-paste.

How to Use

Select the Gradient Type (Linear or Radial).
Adjust the Angle (for Linear) or Shape (for Radial).
Pick your Start and End colors using the color pickers.
Copy the generated CSS code from the text area.