CSS Filter Generator

Blur, brighten and tint with CSS filters.

Free CSS filter generator. Combine blur, brightness, contrast, grayscale, saturate and sepia with sliders, preview the effect live, and copy the filter CSS. Runs in your browser.

How to use the CSS Filter Generator

  1. 01Adjust the blur, brightness, contrast and other sliders.
  2. 02See the effect applied to the preview live.
  3. 03Copy the combined filter CSS.

Frequently asked questions

Can I stack multiple filters?

Yes. CSS filters combine in a single filter property, and this tool outputs all your adjustments together in one line ready to paste.