CSS Gradient Generator

Create linear gradients and copy ready-to-use CSS code.

Color 1

Color 2

Angle135deg

background: linear-gradient(135deg, #FF4D1C, #7C6AE0);

Result not what you expected?Tell us what happened and we will fix it fast.

Frequently asked questions

How do I use the generated CSS?

Copy the output and paste it into a CSS rule as your background value.

Can I change gradient direction?

Yes. Use the angle slider to set any direction from 0 to 360 degrees.