CSS 滤镜生成
CSS 滤镜生成 — 使用CSS 滤镜生成处理输入内容,设置亮度 (%)、对比度相对100%的增量 (%)、灰度 (%)并核对输出后再复制。
外观与输出
在当前浏览器运行处理结果
填写参数后点击主按钮查看结果。
如何使用CSS 滤镜生成
- 先核对预填案例与字段单位,再替换成自己的资料。
- 使用CSS 滤镜生成处理输入内容,设置亮度 (%)、对比度相对100%的增量 (%)、灰度 (%)并核对输出后再复制。
- 运行工具并核对结果,再复制或下载需要保留的内容。
方法与适用口径
组合亮度、对比度、灰度和模糊参数
颜色换算使用 sRGB,CMYK 无 ICC 色彩管理,仅供屏幕参考。对比度按 WCAG 2 的亮度公式,不能独立保证整页可访问性。
输入示例
亮度 (%): 100 对比度相对100%的增量 (%): 4 灰度 (%): 8 模糊半径 (px): 16
业务问题与结果核对
CSS 滤镜生成如何确定输出?
组合亮度、对比度、灰度和模糊参数
处理前应核对哪些输入条件?
颜色换算使用 sRGB,CMYK 无 ICC 色彩管理,仅供屏幕参考。对比度按 WCAG 2 的亮度公式,不能独立保证整页可访问性。
如何核对输出结果?
可先用预制案例检查,再将关键结果与原始文件或业务单据逐项比对。
亮度 (%): 100 对比度相对100%的增量 (%): 4 灰度 (%): 8 模糊半径 (px): 16
相关工具
颜色与设计
渐变 CSS 生成
使用渐变 CSS 生成处理输入内容,设置基础颜色、第二颜色、渐变角度 (°)并核对输出后再复制。
颜色与设计Box Shadow 生成
使用Box Shadow 生成处理输入内容,设置基础颜色、水平偏移 (px)、垂直偏移 (px)并核对输出后再复制。
颜色与设计Text Shadow 生成
使用Text Shadow 生成处理输入内容,设置基础颜色、水平偏移 (px)、垂直偏移 (px)并核对输出后再复制。
颜色与设计Border Radius 生成
使用Border Radius 生成处理输入内容,设置左上半径 (px)、右上半径 (px)、右下半径 (px)并核对输出后再复制。
颜色与设计Favicon 背景预览
使用Favicon 背景预览处理输入内容,设置基础颜色、第二颜色、图标文字并核对输出后再复制。
颜色与设计HEX RGB HSL 颜色转换
使用HEX RGB HSL 颜色转换处理输入内容,设置基础颜色并核对输出后再复制。