Build a CSS box-shadow with offsets, blur, spread, color, opacity and inset
CSS Gradient Builder
Runs locally
Use CSS Gradient Builder
What it does
Choose linear or radial, an angle and two colors; the preview and the CSS background declaration update as you change them.
It runs entirely in your browser: nothing you enter is uploaded.
Example
Left-to-right gradient
90background: linear-gradient(90deg, #22c55e, #3b82f6);Sets the angle to 90°: background: linear-gradient(90deg, #22c55e, #3b82f6); with the default green and blue.
FAQ
What gradients can it build?
Two color stops only: a linear-gradient() at an angle in degrees, or a radial-gradient(circle, …) from the center. For more stops, stop positions or repeating gradients, edit the copied CSS.
Why does the angle not affect the radial gradient?
The angle is only used for linear gradients; the radial option always draws a centered circle.
Does it send anything?
No. The CSS is built and previewed in your browser; nothing is uploaded.