Gradient Controls

90°
0%
100%

Presets

Preview

CSS Output

How It Works

Gradients are smooth transitions between two or more colors. They are created using CSS and can be applied to various elements in web design. The main types of gradients are:

  • Linear Gradients: Colors flow in a straight line.
  • Radial Gradients: Colors spread out in a circular pattern.
  • Conic Gradients: Colors rotate around a center point.

The basic formula for creating a gradient in CSS is:

background: gradient-type(direction, color1 stop1, color2 stop2, ...);

For more information on gradients, check out these resources: