LoveCSS.comLoveCSS

CSS Filter Generator

Filters

%
%
%
%

Preview

Filter preview

Presets

Active Filters

No filters applied

CSS

.image {
  filter: none;
}

HTML

<img
  class="filtered-image"
  src="image.jpg"
  alt="Filtered image"
/>

About CSS Filter Generator

Apply CSS filters visually to images. Adjust brightness, contrast, blur, grayscale, hue, saturation, and more, then generate clean CSS instantly.

Related Tools

More free CSS generators you might like.

CSS Transform Generator

Rotate, scale and skew elements.

Clip-Path Generator

Cut custom shapes with clip-path.

CSS Shape Generator

Build shapes using pure CSS.

Gradient Generator

Create beautiful, animated CSS gradients visually.

Also check out the Clip-Path Generator and the Gradient Generator.