CSS 滤镜生成器

在预览图片上可视化地调节 CSS 滤镜（模糊、亮度、对比度、饱和度、灰度、复古棕褐色、反相、色相旋转），然后复制得到的 filter 代码。不会向服务器发送任何内容：所有计算都直接在您的浏览器中完成。

示例：
CSS 代码

工作原理

CSS 属性 filter 可以直接在浏览器中应用图形效果（模糊、亮度、对比度等），而无需修改源图片。借助本工具，您可以在实时预览中同时组合多种效果，然后获取可直接粘贴到样式表中的精确数值，用于图片、图库缩略图或悬停效果。

CSS 滤镜会修改原始图片文件吗？

不会。filter 只是浏览器在渲染元素时应用的纯视觉效果，图片文件在磁盘上保持不变。若要得到永久修改后的图片，需要把它重新绘制到 canvas 上再导出。

可以在鼠标悬停时为 CSS 滤镜添加动画吗？

可以。把该属性与 :hover 规则以及 filter 上的 transition 结合使用，效果就会在两种状态之间逐渐过渡，这是作品集缩略图或商品卡片中的常见做法。

不会向服务器传输任何图片或数据：滤镜的计算仅在您的浏览器中运行。