Question 1

How do I use the CSS gradient generator?

Accepted Answer

Choose a gradient type (linear, radial, or conic), add color stops using the add button, adjust the angle or position, and copy the generated CSS code. The preview updates instantly as you make changes.

Question 2

What are color stops?

Accepted Answer

Color stops define the colors and their positions in a gradient. Each stop has a color (with optional transparency) and a position (0% to 100%). At least 2 stops are required to create a gradient.

Question 3

Can I use transparency in gradients?

Accepted Answer

Yes. Each color stop supports an alpha (transparency) value from 0 (fully transparent) to 1 (fully opaque). The preview shows a checkerboard background so you can see the transparency.

Question 4

What gradient types are supported?

Accepted Answer

Three types are supported: linear (straight line), radial (circular or elliptical from center), and conic (angular sweep around a center point). Each type has its own direction and shape controls.

Question 5

Can I share my gradient?

Accepted Answer

Yes. The URL updates automatically with your gradient settings, so you can copy and share the link. The recipient will see the same gradient you created.

CSS Gradient Generator

Common Questions

Related tools