VSCode Extensions: Visuals

Visual cues

There are a few extensions that, with small visual cues, makes coding just a little bit easier. The ones I use right now:

Bracket Pair Colorizer 2

This can help you understand what is enclosed by what. It simplifies debugging as well as makes you more aware of potential mis-types as they happen. The extension will color the opening and closing brackets that belong together in the same color:

Bracket Pair Colorizer 2 in action

Update: Since Bracket Pair Colorizer was so popular, Microsoft has now included it in Visual Studio out of the box, you don’t need to install it as an extension.

Color Highlight

See what color you’re setting at a glance.

A subtle grey, on display

Highlight Matching Tag

Similar help as what Bracket Pair Colorizer gives, but I like how the corresponding opening/closing tag lights up for a few milliseconds when the mathcing tag is clicked.

Match made in heaven

TODO Higlight

If there is a part of the code you know you’ll need to re-visit later, this is great way to set a reminder.

Note to self, by TODO highlight

You can find all of these in the Extensions Marketplace in VSCode.