Bracket Pair Colorizer 3

A VS Code extension that colorizes matching brackets for improved code readability. Each nesting level gets its own color, making it easy to identify scope boundaries at a glance.

Maintained by Hoai Huynh.

Screenshot:

Settings

"bracket-pair-colorizer-3.colors"
Define the colors used to colorize brackets. Accepts valid color names, hex codes, and rgba() values.

"bracket-pair-colorizer-3.colors": [
    "Gold",
    "Orchid",
    "LightSkyBlue",
    "PaleGreen",
    "Coral",
    "LightSalmon",
    "MediumPurple",
    "Turquoise"
]

"bracket-pair-colorizer-3.forceUniqueOpeningColor"

"bracket-pair-colorizer-3.forceIterationColorCycle"

"bracket-pair-colorizer-3.colorMode"
Consecutive brackets share a color pool for all bracket types
Independent brackets allow each bracket type to use its own color pool

"bracket-pair-colorizer-3.highlightActiveScope"
Should the currently scoped brackets always be highlighted?

"bracket-pair-colorizer-3.activeScopeCSS"
Choose a border style to highlight the active scope. Use {color} to match the existing bracket color
It is recommended to disable the inbuilt editor.matchBrackets setting if using this feature

"bracket-pair-colorizer-3.activeScopeCSS": [
    "borderStyle : solid",
    "borderWidth : 1px",
    "borderColor : {color}",
    "opacity: 0.5"
]

"bracket-pair-colorizer-3.showBracketsInGutter"
Show active scope brackets in the gutter

"bracket-pair-colorizer-3.showBracketsInRuler"
Show active scope brackets in the ruler

"bracket-pair-colorizer-3.rulerPosition"
Decoration position in the ruler

"bracket-pair-colorizer-3.showVerticalScopeLine"
Show a vertical line between the brackets? Enabled by default

"bracket-pair-colorizer-3.showHorizontalScopeLine"
Show a horizontal line between the brackets? Enabled by default

"bracket-pair-colorizer-3.scopeLineRelativePosition"
Disable this to show the vertical line in column 0

"bracket-pair-colorizer-3.scopeLineCSS"
Choose a border style to highlight the active scope. Use {color} to match the existing bracket color

"bracket-pair-colorizer-3.scopeLineCSS": [
    "borderStyle : solid",
    "borderWidth : 1px",
    "borderColor : {color}",
    "opacity: 0.5"
]

"bracket-pair-colorizer-3.excludedLanguages"
Exclude a language from being colorized

Commands

These commands will expand/undo the cursor selection to the next scope

"bracket-pair-colorizer-3.expandBracketSelection"
"bracket-pair-colorizer-3.undoBracketSelection"

Quick-start:

{
    "key": "shift+alt+right",
    "command": "bracket-pair-colorizer-3.expandBracketSelection",
    "when": "editorTextFocus"
},
{
    "key": "shift+alt+left",
    "command": "bracket-pair-colorizer-3.undoBracketSelection",
    "when": "editorTextFocus"
}