CSS 滤镜生成器
可视化调整常用 CSS filter 属性，并复制可直接使用的样式代码。
滤镜参数
预览与代码
filter: brightness(100%) contrast(100%) saturate(100%) grayscale(0%) hue-rotate(0deg) blur(0px); 输入与输出示例
contrast 120% · saturate 140%filter: contrast(120%) saturate(140%);如何使用
- 拖动各项滤镜参数。
- 在预览图形上查看效果。
- 复制生成的 CSS 声明。
能力与限制
- 浏览器本地处理
- 预览使用 CSS 渲染，实际图片与浏览器版本可能略有差异。
- 不上传图片，也不改变任何源文件。
常见问题
- 能导出处理后的图片吗？
- 此工具只生成 CSS 代码；需要新图片文件请使用图片处理工具。
相关指南
颜色格式与对比度：从 HEX 到可读的界面配色 ↗相关工具
更新于 2026-10-17 · 项目与反馈说明