Color Highlight:Sublime Text 颜色代码可视化插件
Color Highlight 是一款轻量级的 Sublime Text 插件,能够自动识别并高亮显示各种格式的颜色代码。通过实时的颜色背景和侧边栏图标展示,让开发者能够直观地看到代码中的颜色效果。
核心功能特性
Color Highlight 支持多种颜色表示格式:
- CSS3 颜色名称:如
green、black等标准颜色名称 - 十六进制格式:
#RGB、#RGBA、#RRGGBB或#RRGGBBAA - 十六进制数字:前缀 0x 格式如
0xRRGGBB或0xRRGGBBAA - RGB/RGBA 值:
rgb(red, green, blue)或rgba(red, green, blue, alpha) - HSL/HSLA 值:
hsl(hue, sat%, lum%)或hsla(hue, sat%, lum%, alpha) - HSV/HSVA 值:
hsv(hue, sat%, val%)或hsva(hue, sat%, val%, alpha) - HWB 值:
hwb(hue, white%, black%)或hwb(hue, white%, black%, alpha) - CIELAB 值:
lab(lum, a, b)或lab(lum, a, b, alpha) - 圆柱形 CIELAB:
lch(hue, chroma, lum)或lch(hue, chroma, lum, alpha) - ANSI 转义序列:支持 3/4 位(8色)、8位(256色)、24位(真彩色)
安装方法
通过 Package Control 安装(推荐)
- 打开命令面板:按下
Ctrl+Shift+P(Windows)或Cmd+Shift+P(Mac) - 输入 "Install Package" 并选择
- 搜索 "Color Highlight" 并安装
手动安装
如需手动安装,可以克隆仓库到 Sublime Text 的 Packages 文件夹:
git clone https://gitcode.com/gh_mirrors/co/ColorHighlight
确保目录名称为 "Color Highlight"。
配置选项
Color Highlight 提供了丰富的配置选项,用户可以通过命令面板打开设置:
Preferences: Color Highlight Settings - User
主要配置参数
-
highlight:设置高亮模式
true:输入时实时高亮(默认)false:仅在手动触发时高亮"load-save":仅在文件加载和保存时高亮"save-only":仅在文件保存时高亮
-
gutter_icon:侧边栏图标样式
"circle":圆形图标(默认)"square":方形图标"fill":填充整个侧边栏false:禁用侧边栏图标
- highlight_values:启用或禁用值区域高亮
- named_values:高亮 HTML 命名颜色
- hex_values:高亮十六进制颜色
- 0x_hex_values:高亮 0x 格式十六进制颜色
- xterm_color_values:高亮 xterm 颜色
- 各种颜色格式的单独开关(rgb_values、hsv_values、hsl_values 等)
使用场景
前端开发
在编写 CSS、SCSS、Less 等样式文件时,Color Highlight 能够实时显示颜色代码对应的实际颜色,避免在编辑器和浏览器之间反复切换。
UI/UX 设计
设计师在编写设计规范或代码时,可以通过直观的颜色展示确保设计的一致性和准确性。
代码审查与调试
在代码审查过程中,颜色代码的可视化展示有助于快速发现颜色使用错误或不一致的问题。
性能优化
Color Highlight 经过优化设计,对编辑器性能影响极小。对于大型项目,可以通过以下设置进一步优化性能:
{
"color_highlight_max_file_size": 2097152,
"color_highlight_match_scan_limit": 5000
}
注意事项
需要注意的是,该项目自 2018 年起已不再积极维护,目前仅进行最小程度的维护和错误修复。作为替代方案,用户可以考虑使用更现代的 Color Helper 包。
许可证
本项目采用 MIT 许可证发布,版权归 German Mendez Bravo (Kronuz) 所有。
Color Highlight 最初是基于 Monnoroch 的 ColorHighlighter 项目的一个分支,经过多年发展已成为 Sublime Text 社区中广受欢迎的颜色可视化工具。
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考




