Bracket Pair Colorizer 是一款轻量实用的 VSCode 插件，通过为不同层级括号赋予颜色直观展示嵌套结构，降低匹配错误率；支持自定义颜色、高亮激活对、语言过滤，并可与 Auto Close Tag 等插件协同提升效率。
Bracket Pair Colorizer 是一个轻量但非常实用的 VSCode 插件，它通过为不同层级的括号（()、[]、{}）赋予不同颜色，直观呈现嵌套结构，大幅降低括号匹配出错的概率。
为什么需要它？
在写 JavaScript、TypeScript、JSON 或嵌套较深的模板语法（如 Vue 的 <template></template>）时，肉眼快速判断哪一对括号属于同一层级并不容易。尤其当代码折叠、缩进不明显或存在多行表达式时，漏掉一个 } 或多写一个 ) 常导致语法错误或运行异常。Bracket Pair Colorizer 用颜色代替位置记忆，让配对关系“一眼可见”。
安装与基础配置
在 VSCode 扩展市场中搜索 Bracket Pair Colorizer 2（推荐使用 2.x 版本，原版已停止维护），点击安装即可生效。默认开启，无需额外设置就能工作。
- 支持自定义颜色：在设置中搜索
bracket pair colorizer，修改bracketPairColorizer.consecutivePairColors数组，例如["#ff6b6b", "#4ecdc4", "#45b7d1", "#96ceb4"] - 可启用高亮激活括号：开启
bracketPairColorizer.highlightActiveBracketPair，光标停在某个括号上时，整对会加粗+加深色 - 支持忽略特定语言：如不想在 Markdown 中高亮，可在
bracketPairColorizer.languages中移除markdown
与其他插件的协同
它和 Auto Close Tag、Auto Rename Tag 配合使用体验更佳——前者自动补全 HTML 标签，后者实时重命名，而 Bracket Pair Colorizer 确保你始终看清结构是否闭合正确。
- 与 Prettier 冲突？一般不会。Colorizer 只做视觉标记，不改动代码内容或格式
- 若发现括号颜色没反应，检查是否被其他括号高亮插件（如 “Rainbow Brackets”）禁用，建议只保留一个同类工具
- 部分主题（如 One Dark Pro）可能让默认颜色对比度偏低，可微调颜色值提升可读性
小技巧提升效率
把光标放在任意括号上，按 Ctrl+Shift+P（Win/Linux）或 Cmd+Shift+P（Mac），输入 Go to Bracket 即可跳转到匹配项——Colorizer 让这个操作更有依据，也更安心。
- 配合键盘快捷键
Ctrl+Shift+ArrowLeft/Right可选中当前括号包裹的整个区块 - 写正则或 SQL 片段时，嵌套括号多且无缩进，Colorizer 尤其管用
- 团队协作中，新成员阅读旧代码时，彩色括号能显著缩短理解成本
基本上就这些。不需要复杂配置，装上即用，却能在日常编码中持续减少低级错误——小工具，真有用。
