Eye Like Light

English · 中文

一款专为长时间编码设计的护眼浅色主题。配色方案基于色彩科学研究和 WCAG 无障碍标准，兼顾舒适性与高区分度。

设计原则

1. 暖白背景，告别刺眼纯白

问题：纯白 #FFFFFF 背景配合深色文字会产生「光晕效应」（halation），即白光从背景溢出，模糊文字边缘，长时间阅读会导致眼睛疲劳。这类似于在直射阳光下阅读——对比度过高，瞳孔需要不断调节。

方案：采用 #FAF8F5 作为编辑器背景——一种带微黄暖调的米白色（HSB: 30°, 2%, 98%）。灵感来源于：

• Solarized 主题设计师 Ethan Schoonover 的理念：将理想的屏幕阅读体验比作"坐在树荫下看书"——纸张柔和、对比适中，而非"烈日下的白纸"
• 传统出版业使用米黄色纸张而非亮白纸张，也是出于同样的阅读舒适性考虑
• 暖色调降低蓝光比例，对视觉系统的刺激更小

参考：Solarized 官方设计文档

2. 感知均匀的色彩明度（CIELAB L*）

问题：如果某些语法颜色特别亮、某些特别暗，眼睛需要反复适应不同亮度，增加视觉疲劳。例如一个亮红色关键字和深蓝色函数名放在一起，视觉上的"音量"不一致。

方案：所有 6 种语法强调色都经过 CIELAB 色彩空间校准，L*（明度）值集中在 38–48 的中等区间内：

这意味着每种颜色在视觉上的"分量"相近，你不会觉得某个 token 比其他的更"吵"。区分度主要来自色相差异（hue），数字与常量则以明度差异（亮琥珀 vs 深棕橙）相互区分。

参考：Solarized CIELAB 设计原理、WCAG 2.1 对比度标准

3. 中等饱和度，避免"霓虹灯"效果

问题：高饱和颜色在浅色背景上会产生刺眼的"发光"感。例如纯绿 #00FF00 在白底上几乎无法阅读，饱和度过高的 #008000 在长时间编码后也会产生视觉残留。

方案：大部分语法色的 HSB 饱和度控制在 55%–80% 范围内（对比：纯色为 100%）。参考 Solarized 的做法——降低亮度对比但保持色相对比，用温和但可区分的色彩取代刺眼的纯色。

例外：琥珀橙（数字，饱和度约 87%）略高于此上限——因为在暖白背景上进一步降低橙色饱和度会使其发"浑"、偏向泥棕，反而降低辨识度。故此单一色相保留较高饱和度。

4. WCAG 对比度合规

所有语法颜色与背景 #FAF8F5 的对比度均达到 WCAG AA 标准（≥ 4.5:1）；正文文字达到 AAA 标准（≥ 7:1）。以下为实测对比度：

注释刻意使用较低对比度——作为"背景知识"，它们不需要也不应该抢夺注意力。

参考：WCAG 2.1 SC 1.4.3 对比度（最小值）

5. 六色色相分布，最大化可区分性

6 种语法颜色在色轮上均匀分布，确保即使对色觉不敏感的用户也能区分：

色轮分布（5 个色相 + 一对明暗琥珀）:

    0°          60°         120°        180°        240°        300°
    |           |           |           |           |           |
    橙          黄-绿       绿          青          蓝          紫-红
  数字/常量    (留空)      字符串      (留空)      函数        关键字
  亮 #AD5E17               #2D7D53                 #2860A6     #B8345E
  深 #7E4E1E                                       类型
                                                   #7B50B0

数字与常量同属暖橙色相，但以明度区分：数字为亮琥珀（L* ≈ 48），常量为深棕橙（L* ≈ 38），二者相差约 10 个 L* 单位，一眼可辨。其余色相间隔：橙→绿 约 85°、绿→蓝 约 140°、蓝→紫 约 70°、紫→橙 约 105°，各色距离足够大，即使在低色觉情况下也不易混淆。

特殊考量：避免红-绿配对作为唯一区分手段（约 8% 的男性有红绿色盲），本主题中红色（关键字）和绿色（字符串）除了色相不同外，还有明显的饱和度和明度差异。

6. 语义分组的色彩逻辑

颜色的选择不是随机的，而是遵循语义直觉：

参考：GitHub Light 主题 的语义分组、Solarized 色彩语义

完整色彩方案

语法高亮

编辑器界面

UI 面板

Git 装饰

使用方式

1. 在 VS Code 中按 F5 启动扩展开发宿主（Extension Development Host）
2. 在开发宿主窗口中，打开命令面板（Ctrl+Shift+P）
3. 输入 Preferences: Color Theme
4. 选择 Eye Like Light

与同类主题对比

License

MIT