Create advanced CSS gradients: multiple stops, drag & drop, RGB or HSL interpolation, linear/radial/conic. Export as CSS, SCSS or SVG.
Your gradient in context
By default, CSS interpolates gradients in sRGB space, which can create grey or dull zones in the middle of some gradients. HSL interpolation better preserves saturation, giving more vivid transitions. The perceptually uniform OKLab space produces the most natural gradients, avoiding saturation bands.
Linear gradient is most common but conic and radial gradients offer unique possibilities. Radial creates halo, bokeh, or ambient light effects. Conic allows spectrum, rainbow or even rotation simulation effects. They're rarely used as main backgrounds but as accents or overlays.