CSS Gradient Generator

Generate CSS gradient code. Free, instant.

x.trim());if(c.length<2)return 'Enter two colors: #ff0000, #0000ff';return 'background: linear-gradient(135deg, '+c[0]+' 0%, '+c[1]+' 100%);\\nbackground: -webkit-linear-gradient(135deg, '+c[0]+' 0%, '+c[1]+' 100%);';"}'>

Two colors (hex, comma-separated)

CSS Code

How to Use CSS Gradient Generator

Enter two hex colors.

Get gradient CSS.

Copy or download your result.

Frequently Asked Questions

Gradient directions?

to right, to bottom, 135deg (diagonal), or use radial-gradient for circles.