图片 CSS 滤镜（filter）生成器

图片 CSS 滤镜（filter）生成器: 用途

CSS 的 filter 属性无需编辑文件就能应用照片效果。选择一张照片，调整亮度、对比度、饱和度、灰度、复古色、色相、反相、模糊、不透明度以及沿轮廓的阴影（drop-shadow）。

可以从现成滤镜（黑白、复古、冷色、暖色、褪色、鲜艳、夜晚）开始，复制 CSS，或下载已应用滤镜的图片。悬停选项会生成经典效果：鼠标悬停时照片恢复正常，过渡会尊重偏好减少动态效果的用户。

使用方法

1. 选择照片或使用示例。
2. 调整控件或选择现成滤镜。
3. 复制 CSS 或下载图片。

使用场景

• 黑白的团队照片。
• 带悬停效果的相册。
• 带轮廓阴影的 logo。

常见问题

用 filter 而不是编辑照片有什么好处？

同一张照片可以用于多种效果，而且可以让变化产生动画，例如黑白照片在鼠标悬停时变为彩色。不必为每种效果保存一个版本。

滤镜的顺序重要吗？

重要。滤镜按从左到右的顺序应用，每一个都作用于前一个的结果。因此先复古色再改变色相，与相反顺序得到的结果不同。

drop-shadow 和 box-shadow 有什么区别？

box-shadow 绘制的是图片矩形的阴影。drop-shadow 是一种滤镜，它会沿着可见内容的轮廓生成阴影，因此适用于背景透明的 PNG 和 SVG，例如 logo 和抠图。

真的免费吗？

是的，100%免费。无需注册，无需订阅，不限使用次数。所有工具：Tools123是免费的。

相似工具