在线色盲模拟器:输入任意颜色,模拟红色盲(Protanopia)、绿色盲(Deuteranopia)、蓝色盲(Tritanopia)等多种色觉障碍下的视觉效果,无障碍设计必备,全部本地处理。
摘要:免费的在线色盲模拟器,模拟红色盲、绿色盲、蓝色盲等多种色觉障碍下的颜色视觉效果,输入任意颜色即时对比,无障碍配色设计必备,本地处理不上传。
此工具完全在您的浏览器中运行。打开 DevTools → Network 面板,搜索您的输入内容——它不会出现在任何请求中。
使用指南
色觉正常的人看界面觉得对比清晰,但红绿色弱用户看到的可能是另一番景象——按钮和背景糊成一片。本工具模拟三种常见色觉障碍(红绿色弱、绿红色弱、全色盲)下的视觉效果,把图片或页面截图转换后对比,本地处理。
1. 怎么用
- 上传图片(UI 截图、图表、信息图)或输入颜色代码。
- 选择模拟类型:红色盲/绿色盲/蓝色盲/全色盲,预览转换效果。
- 左右对比原图与模拟图,评估信息是否仍可区分。
2. 可访问性检查的实操建议
- 红绿色弱最常见(约 8% 男性)——不要只靠颜色传递状态(成功=绿、失败=红),要叠加图标或文字。
- 数据可视化一定要检查:折线图多条线只靠颜色区分,在色弱用户眼里可能完全重合。
- WCAG 对比度标准(4.5:1)是基线,但高对比度的两种颜色在色弱下也可能混淆——模拟器能发现这种坑。
- 品牌色设计阶段就做模拟——比上线后改视觉便宜一个数量级。
3. 模拟的局限与正确用法
模拟器是近似模型,不是色弱用户的真实体验——真实色觉障碍是连续谱,简化模型(比如红绿色弱假设 L 锥体完全缺失)只是代表性近似。正确用法是「设计辅助」而非「验收标准」:它帮你发现「仅靠颜色区分信息」的设计,但最终验证还是需要真实用户测试(或遵循既定可访问性规范)。另一个实用点:色弱模拟同样适合检查非 UI 场景——数据图表配色、地图分级着色、游戏 UI 的稀有度颜色。
常见问题
完全免费,无需注册。颜色转换在浏览器本地完成,不上传任何数据。
支持红色盲(Protanopia)、绿色盲(Deuteranopia)、蓝色盲(Tritanopia)等多种类型模拟。
可以直观检查配色方案在色觉障碍用户眼中的可辨识度,帮助调整对比度、避免仅靠颜色传递信息。