VS Code Extension of the Day: Bracket Pair Colorizer

Published on 02 August 2018 • Estimated reading time: 1 minutes

Note This is the 3rd post in a multipart series. If you want to read more, see our series index.

Initially, this extension allows your brackets { } [ ] ( ) to be set to a unique color per pair. This makes it really easy to spot when you’ve made a mistake and removed a closing bracket. Behind the obvious, there are a lot of really awesome extras.

You can make the brackets highlight when you click on them—when you click on one, its pair highlights via bracketPairColorizer.highlightActiveScope. You can also add an icon to the gutter of the other pair with bracketPairColorizer.showBracketsInGutter, which makes it trivial to work out the size of the scope.

It also adds a function bracketPairColorizer.expandBracketSelection, which is unbound by default but will allow you to select the entire area within the current bracket pair. Do it again, and it will include the next scope. For example, you can select the entire function, then the entire class. Learn more and download it