必须手动启用 preferences: file icon theme,安装插件仅注册不生效;配置 workbench.icontheme 值须为扩展 id(如 "material-icon-theme");图标显示方块需安装 nerd fonts;勿同时启用多个图标主题;图标与颜色主题完全解耦,须分别设置。

装完插件图标没变?必须手动启用 Preferences: File Icon Theme
VSCode 不会因为安装了 material-icon-theme 或 vscode-icons 就自动切换图标——装只是注册,启用才是关键。很多人卡在这一步,以为插件失效了,其实只是漏了命令面板那一下。
- 按
Ctrl+Shift+P(Windows/Linux)或Cmd+Shift+P(macOS)打开命令面板 - 输入并选择
Preferences: File Icon Theme(注意不是Color Theme) - 从列表中选中你装的扩展 ID,比如
material-icon-theme(大小写、连字符必须完全一致) - 如果列表为空,去扩展面板检查该插件是否已启用,而非仅“已安装”
workbench.iconTheme 配置值写错就白忙活
手动改 settings.json 是最稳妥的方式,但值必须是扩展注册的 ID,不是显示名、不是文件夹名、也不是插件市场页面上的标题。
- 正确写法:
"workbench.iconTheme": "material-icon-theme"(对应官方扩展 IDPKief.material-icon-theme) - 错误写法:
"workbench.iconTheme": "Material Icon Theme"或"workbench.iconTheme": "material-icons" - 该配置可写在用户级或工作区级
settings.json中;若项目根目录有.vscode/settings.json,它会覆盖用户设置 - 改完保存即生效,无需重启 VSCode
图标显示为方块 □?大概率是缺 Nerd Fonts
尤其是 vscode-icons 这类依赖符号图标的主题,系统没装补丁字体,VSCode 就 fallback 到空白方块。这不是插件问题,而是渲染链断了。
- Windows 用户:下载安装
FiraCode Nerd Font,再在设置中配"editor.fontFamily": "'FiraCode Nerd Font', Consolas, 'Courier New', monospace" - macOS 用户:通常自带足够字体,但若异常,可用
brew install --cask font-fira-code-nerd-font - Linux 用户:安装字体后务必运行
fc-cache -fv刷新缓存,否则新字体不被识别 - 别同时启用多个图标主题插件——VSCode 不报错,但后启用的那个会静默覆盖前一个
图标主题和颜色主题完全解耦,别指望自动联动
选了 Dracula Official 颜色主题,不代表文件图标就会自动变成紫色风格。二者配置项独立、加载逻辑独立、甚至插件作者都不同。哪怕你用了同一套设计语言的主题包,也得分别执行一次 Preferences: Color Theme 和 Preferences: File Icon Theme。
最容易被忽略的一点是:图标主题的视觉效果高度依赖侧边栏背景色与图标颜色的对比度。比如深色主题下,material-icon-theme 默认给文件夹上色,若不调 "material-icon-theme.folders.color",文件夹可能融进背景里看不见。











