WebStorm界面颜色与编辑器主题完全独立，必须分别设置Appearance→Theme（如Darcula）和Editor→Color Scheme（同样选Darcula或深色方案），并同步配置Editor background、Default Text背景及Line numbers背景，缺一不可。
WebStorm 的界面颜色和编辑器主题是两套完全独立的系统，改了其中一个，另一个不会自动同步——这是绝大多数人配错的根本原因。
为什么选了 Darcula 主题，代码区还是白底？
因为 Darcula 在 Appearance 页面只控制菜单栏、侧边栏、按钮等 UI 元素；而代码区（即编辑器）底色由 Editor > Color Scheme 单独决定。两者必须分别设置，缺一不可。
- Appearance → Theme 选
Darcula：UI 变暗，但编辑器仍是白底 - Editor → Color Scheme → Scheme 下拉框也必须选
Darcula或其他深色方案（如Dracula、GitHub Dark） - 如果下拉框里没有
Darcula，点齿轮图标 →Restore Defaults，它就会出现
改完配色方案却没生效？检查这三个关键 background
编辑器“有底色”靠两个层级叠加：Editor background 是整个编辑区画布底色，Default Text > Background 是文字所在区域底色，Line numbers > Background 控制行号背景。漏掉任一都会出视觉异常。
-
General > Editor background：设为#1e1e1e这类深灰，作为整体基底 -
General > Text > Default Text > Background：建议略浅一级，比如#252525，否则行号会糊进背景看不清 -
General > Line numbers > Background：务必单独设色，别让它继承默认值，否则在深色方案下可能变成透明或纯黑 - 改完必须点右下角
Apply，新版 WebStorm 不需重启，但不点就无效
想自定义配色？千万别直接改 Darcula
直接在预定义方案上修改，升级 WebStorm 后所有改动会被清空，且无法回滚。正确做法永远是先复制再编辑。
- 进入
Editor > Color Scheme，选中Darcula - 点右上角
⋮→Copy…，起名如MyDark（纯英文、无空格、无特殊符号） - 从 Scheme 下拉框中选中你新建的方案，再开始调色
- 如要改 JSX 中
${}颜色：展开JavaScript或TypeScript→Template literal→Placeholder delimiter→ 取消勾选Inherit values from，再手动设色
导入第三方主题包后代码颜色没变？
大多数 .jar 主题包（如 jetbrains-monokai-sublime）只含界面主题，不含配色方案。它们不会动 Color Scheme 设置，所以代码区颜色不变是正常现象。
- 导入路径不能含中文或空格，否则报错
Failed to load theme - 导入后必须执行
File > Manage IDE Settings > Refresh IDE Cache and Restart，否则主题可能错位或不生效 - 导入成功后，仍需手动进
Editor > Color Scheme选择或创建一个匹配的深色配色方案 - JetBrains Marketplace 安装的主题插件，通常同时提供 UI 主题 + 配色方案，优先选这类
最常被忽略的一点：行号背景色和编辑器底色之间要有足够对比度，否则调试时扫一眼根本找不到当前行在哪。这不是审美问题，是效率瓶颈。
