无需上传、100% 本地处理、无需账户

色盲模拟器

通过色觉缺陷者的眼睛看你的图片。选择类型,预览并下载结果。一切都在浏览器中运行。

色盲模拟器 的工作原理

色盲模拟器对你的图像应用颜色变换矩阵,显示它在患有红色盲(protanopia)、绿色盲(deuteranopia)、蓝色盲(tritanopia)或全色盲(achromatopsia)的人眼中是什么样子。矩阵通过浏览器中的 Canvas.getImageData() 和 Canvas.putImageData() 逐像素应用。没有图像数据传输到服务器。

这些模拟基于从色觉缺陷研究中得出的已发表感知模型。它们是受影响者视觉系统处理颜色方式的近似,不是个人体验的精确再现(个人体验因人而异)。该工具旨在帮助设计师和开发者识别会影响大量受众的对比度或颜色编码问题:约 8% 的男性和 0.5% 的女性存在某种形式的色觉缺陷。

色盲模拟器 的分步使用说明

  1. 将图像拖到上传区域或点击浏览。
  2. 从菜单中选择色觉缺陷类型:红色盲、绿色盲、蓝色盲或全色盲。
  3. 在对比面板中查看模拟结果与原始图像并排显示。
  4. 在模拟类型之间切换,比较每种情况如何影响图像。
  5. 使用并排视图识别仅靠颜色传达信息可能丢失的区域。

常见使用场景

  • UI 设计师在发布功能前检查红绿状态指示器对于绿色盲用户是否可区分。
  • 数据可视化作者验证带有颜色编码系列的多折线图在红色盲模拟下是否仍然可读。
  • 品牌设计师评估带有渐变颜色的徽标在全色盲下的效果,确保其保留可识别的形状和对比度。
  • 游戏开发者测试颜色编码的地图区域对于蓝色盲玩家是否可区分,并添加图案填充以补充颜色编码。

常见问题

色盲模拟有多准确?

模拟应用从已发表的色觉缺陷研究中得出的感知变换矩阵。它们是对每种情况典型案例的有科学依据的近似。个人体验各不相同:具有相同诊断的人之间严重程度不同,模拟无法考虑到一些用户发展出的补偿策略。将输出视为有用的指标,而不是确定性测试。

工具涵盖所有类型的色盲吗?

涵盖的四种类型是最常见的色觉缺陷形式和完全色盲。代表部分缺陷的异常三色视觉类型(红色弱、绿色弱、蓝色弱)在当前版本中没有单独建模。

我的图像是在服务器上分析以生成模拟的吗?

不是。颜色矩阵变换使用 Canvas.getImageData() 读取像素数组,Canvas.putImageData() 写入结果,在本地计算。所有处理都在浏览器标签页内进行,图像数据留在你的设备上。

可以用此工具检查颜色对比度?

此工具显示颜色对色觉缺陷人群的外观,但不以数值方式计算 WCAG 对比率。对于数值对比度检查,请使用颜色转换器工具,其中包含 WCAG 对比度检查器。

工具适用于包含文字的图像吗?

适用。变换应用于整个像素数组,包括图像中渲染的任何文字。这让你可以检查在每种模拟条件下,文字颜色与其背景相比是否仍然清晰可读。