colorhelper 是 sublime text 4 唯一稳定运行的颜色预览插件,其生效需满足 package control 已加载、安装时等待包列表加载完成、且 packages 目录下存在大小写精确匹配的 colorhelper 文件夹;预览依赖语法作用域,须确保文件为 css/scss 等支持 scope 的语法,并在 settings - user 中启用 "enable_color_variables" 和 "scan_strings"(如需)。

ColorHelper 是 Sublime Text 4 唯一能稳定工作的颜色预览与交互插件,装了 ColorPicker 也白装——它在 ST4 里根本注册不了命令,连 ImportError: No module named 'tkinter' 都不会报,静默失效。
ColorHelper 安装失败或不生效的真正原因
不是下载源问题,也不是网络卡顿,而是三个条件缺一不可:
- Package Control 必须已加载:按
Ctrl+Shift+P输入Package Control,能看到命令列表才算通过 - 安装时必须等右下角 “Loading package list…” 消失后再输
ColorHelper(输太快会搜不到) - 装完别急着测试,先去
Preferences → Browse Packages确认存在大小写完全一致的ColorHelper文件夹(不是colorhelper或Color Helper)
预览不显示?先看右下角状态栏语言模式
ColorHelper 不靠正则扫描文本,而是依赖 Sublime 的语法作用域(scope)。状态栏显示 Plain text 或 HTML 时,哪怕你写的是 color: #3b82f6;,它也不会启动。
- CSS/SCSS 文件:默认 OK,但需确保光标停在颜色值内部(比如停在
#3b82f6三个字符之一上) - .vue 单文件组件:
<style></style>块必须手动设为source.css.postcss(右键 → Set Syntax),仅设为CSS不行 - HTML 内联样式:
<div style="background: rebeccapurple"> 中,光标必须落在 <code>rebeccapurple上,且右键 → Set Syntax →CSS - 验证 scope:光标停在颜色上,按
Ctrl+Shift+P→ 输入Developer: Show Scope Name,输出中必须含constant.other.color或support.constant.color - 打开
Preferences → Package Settings → ColorHelper → Settings - User,添加或确认这一行:"enable_color_variables": true - 变量定义(
--primary: #3b82f6;)和使用(color: var(--primary);)必须在同一文件、同一语法作用域内;跨 CSS 文件引用无效 - 变量值必须是可识别的颜色字面量,如
--primary: hsl(210, 75%, 50%)可以,--primary: var(--secondary)或--primary: unset不会触发预览 - Sass 变量(
$color)、Less(@color)、env()函数均不支持 - 用户快捷键文件路径:
Packages/User/Default (Windows).sublime-keymap或Packages/User/Default (OSX).sublime-keymap - 用 Sublime 打开该文件,搜索
alt+shift+c或ctrl+shift+c,删掉冲突项,或改成alt+ctrl+shift+c - 改完保存即生效,无需重启;顺手装
FindKeyConflicts插件,以后一键扫全量冲突 - JS 字符串里想识别颜色?在
Settings - User里加"scan_strings": true,但注意:模板字符串中${bg}这类变量引用仍不会解析
var(--primary) 不预览?检查 enable_color_variables 和作用域
var(--primary) 不是“自动支持”,它需要显式启用,且有严格上下文限制:
Alt+Shift+C 没反应?别重装,查快捷键冲突
这个组合键在 Windows 上常被微信/QQ 截图工具劫持,在 macOS 上可能被系统辅助功能拦截。ST 自身键位冲突更常见:
真正卡住人的从来不是“怎么装”,而是装完发现没反应,然后反复重装、换插件、查文档——其实问题就藏在状态栏语言模式、用户 keymap 或 enable_color_variables 的 JSON 格式里。一个逗号错位、一个 scope 没设对、一行配置没加,都足以让整个预览链断掉。











