VS Code 护眼色最佳设置教程

长时间编码容易引起眼睛疲劳，下面提供几种方式来在 VS Code 中设置护眼色，包括插件主题、自定义配色和推荐主题。

长时间编码容易引起眼睛疲劳，下面提供几种方式来在 VS Code
中设置护眼色，包括插件主题、自定义配色和推荐主题。

1. 使用护眼主题插件

Eye Care Themes

  • 插件： Eye Care Themes （作者 lzwme）\
  • 安装方法：
    1. 打开扩展面板（Extensions）。\
    2. 搜索 Eye Care Themes 并安装。\
    3. 重载 VS Code，选择 eye-care 主题即可。\
  • 链接：

Easy Eyes

  • 插件： Easy Eyes （支持 Normal 和 Night 两种模式）\
  • 使用方法：
    1. 安装 Easy Eyes 。\
    2. 打开命令面板 Ctrl+Shift+P → 输入 Preferences: Color Theme →
      选择 Easy Eyes 或 Easy Eyes Night 。\
  • 链接：

2. 使用已有主题并自定义配色

Atom One Light + 绿豆沙背景

  • 推荐使用 Atom One Light 作为基础亮色主题，并自定义绿色背景： 
"workbench.colorTheme":"Atom One Light","workbench.colorCustomizations":{"[Atom One Light]":{"editor.background":"#C7EDCC","sideBar.background":"#C7EDCC","activityBar.background":"#C7EDCC"}}
  • 原理：绿色波长能让眼睛睫状肌相对放松，有助于减轻眼疲劳。

完整绿护眼配色示例 

"workbench.colorCustomizations":{"[Atom One Light]":{"foreground":"#519657","editor.background":"#c8e6c9","editor.lineHighlightBackground":"#dcedc8","editor.selectionBackground":"#f0f4c3","editorWidget.background":"#c8e6c9","editorHoverWidget.background":"#c8e6c9","editorHoverWidget.border":"#a5d6a7","editorLineNumber.foreground":"#a5d6a7","editorWhitespace.foreground":"#a5d6a7","editorIndentGuide.background":"#c8e6c9","editorIndentGuide.activeBackground":"#a5d6a7","editorSuggestWidget.background":"#c8e6c9","editorSuggestWidget.border":"#a5d6a7","editorSuggestWidget.foreground":"#338a3e","editorSuggestWidget.highlightForeground":"#338a3e","editorSuggestWidget.selectedBackground":"#a5d6a7","activityBar.background":"#c8e6c9","activityBar.foreground":"#519657","activityBarBadge.background":"#519657","activityBarBadge.foreground":"#FFFFFF","editorLineNumber.activeForeground":"#519657","input.background":"#c8e6c9","input.border":"#c5e1a5","focusBorder":"#c5e1a5","sideBar.background":"#c8e6c9","sideBarSectionHeader.background":"#c8e6c9"}}

VSCode中settings.json完整配置 

{"workbench.colorTheme":"Atom One Light","workbench.colorCustomizations":{"[Atom One Light]":{"editor.background":"#C7EDCC","sideBar.background":"#C7EDCC","activityBar.background":"#C7EDCC",},"terminal.background":"#C7EDCC","terminal.foreground":"#181818","terminalCursor.background":"#D8D8D8","terminalCursor.foreground":"#D8D8D8","terminal.ansiBlack":"#181818","terminal.ansiBlue":"#7CAFC2","terminal.ansiBrightBlack":"#585858","terminal.ansiBrightBlue":"#7CAFC2","terminal.ansiBrightCyan":"#86C1B9","terminal.ansiBrightGreen":"#A1B56C","terminal.ansiBrightMagenta":"#BA8BAF","terminal.ansiBrightRed":"#AB4642","terminal.ansiBrightWhite":"#F8F8F8","terminal.ansiBrightYellow":"#F7CA88","terminal.ansiCyan":"#86C1B9","terminal.ansiGreen":"#A1B56C","terminal.ansiMagenta":"#BA8BAF","terminal.ansiRed":"#AB4642","terminal.ansiWhite":"#D8D8D8","terminal.ansiYellow":"#F7CA88","terminal.integrated.cursorBlinking":true,"terminal.integrated.lineHeight":1.6,"terminal.integrated.letterSpacing":0.1,"terminal.integrated.fontSize":20,//字体大小设置"terminal.integrated.fontFamily":"Lucida Console",//字体设置},"files.associations":{"*.mlu":"cpp","*.cu":"cpp","*.cuh":"cpp",},"files.autoSave":"afterDelay","workbench.editor.enablePreview":false,"editor.fontSize":28,"explorer.confirmDragAndDrop":false,"window.zoomLevel":-1,"editor.tabSize":4,}

3. 一键护眼主题（多场景）

Low Eye Strain Dark Neon Theme

  • 包含 7 种变体：Dark、Light、Neon、Sunset Red 等。\
  • 适合多场景使用，帮助减少眼睛伤害并调整生物钟。\
  • 链接：

4. 其他推荐主题

  • Night Owl ：专为减少蓝光设计，夜间编程推荐。\
  • Matcha ：绿灰柔和配色，安静清爽。\
  • High Contrast ：高对比度，适合光线复杂环境或视觉需求。

参考：

5. 安装与切换步骤

  1. 选择方案
    • 想要最快上手 → Eye Care Themes / Easy Eyes \
    • 想要绿色护眼 → Atom One Light + 自定义\
    • 想要多样化 → Low Eye Strain / Night Owl
  2. 安装扩展
    • 打开扩展面板 → 搜索名称 → 点击"安装" → 重载。
  3. 切换主题
    • 菜单： File > Preferences > Color Theme （Win/Linux）\
    • 或 Code > Settings > Color Theme （macOS）\
    • 快捷键： Ctrl+K Ctrl+T / ⌘K ⌘T
  4. 自定义（可选）
    • 打开 settings.json → 添加 workbench.colorCustomizations
      配置。

总结

方法 优势 适用场景

Eye Care Themes 一键开启，无需配置 想快速减轻眼疲劳
Easy Eyes 日间/夜间模式切换 光线变化较多
Atom One Light + 自定义 可控性最强 喜欢调配细节
Low Eye Strain 多种风格 不同审美与需求
Night Owl / Matcha 经典低蓝光 夜间或长时间编程