VSCodeTips

VSCodeTips is a community of amazing vscoders

We're a community that shares tips & tricks on how to best leverage VS Code

Create new account Log in
loading...

Native Bracket Pair Colourization in VS Code

Nick Taylor
Lead software engineer at Forem. Creator of the VSCodeTips community.
Updated on ・1 min read

I’m a big fan of the Bracket Pair Colorizer extension, but it looks like this is native in VS Code now and much faster!

Configure native bracket pair colourization

  1. Make sure to remove the Bracket Pair Colorizer extension.
  2. Update VS Code
  3. Open your user settings via CMD (CTRL for non-Mac users) + Shift + P and type settings. The settings JSON file will open. Add the following:
"editor.bracketPairColorization.enabled": true
Enter fullscreen mode Exit fullscreen mode

All colors are themeable and up to six colors can be configured.

James Q. Quick has a video about getting this all set up

Happy VS Coding!

Discussion (3)

Collapse
cerchie profile image
Lucia Cerchie

this looks amazing! What do you need to do to activate it? Do something in VSCode settings, or restart VSCode?

Collapse
nickytonline profile image
Nick Taylor Author • Edited

Update 2021/09/08: It made sense to make this comment part of the original post.

  1. Make sure to remove the bracket colorizer extension.
  2. Update VS Code
  3. Open your user settings via CMD (CTRL for non-Mac users) + Shift + P and type settings. The settings JSON file will open. Add the following:
"editor.bracketPairColorization.enabled": true
Enter fullscreen mode Exit fullscreen mode

All colors are themeable and up to six colors can be configured.

Collapse
cerchie profile image
Lucia Cerchie

sweet thank you!