PB
Available
palette
lock Free · Private · In-Browser

CSS Gradient Generator

Create a simple linear gradient with two colors and an angle, then copy the CSS for backgrounds and hero sections.

Build gradients with restraint

Gradients are useful when they support the content instead of becoming the whole design.

This generator keeps the controls focused: two colors, one angle, live preview, and copyable CSS.

Frequently Asked Questions

What type of gradient does this make?

This version generates clean two-color linear gradients.

Can I change the angle?

Yes. Use the angle slider to rotate from 0 to 360 degrees.

Where can I use the CSS?

Paste it into a background or background-image property.

Take it further
Web Design Services

Need a polished interface, not just generated CSS snippets? Let us build it.

Learn More arrow_forward