{"id":239280,"date":"2022-09-05T08:00:18","date_gmt":"2022-09-05T15:00:18","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/visualstudio\/?p=239280"},"modified":"2024-02-05T12:10:01","modified_gmt":"2024-02-05T20:10:01","slug":"adding-color-to-bracket-pairs","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/visualstudio\/adding-color-to-bracket-pairs\/","title":{"rendered":"Adding color to bracket pairs"},"content":{"rendered":"

When dealing with deeply nested brackets in Visual Studio, it can be hard to figure out which brackets match and which do not. For people with color blindness or other optic maladies, the problem can be even worse. By color-coding bracket pairs, we\u2019re making this much easier.<\/p>\n

\"Image<\/a><\/p>\n

Various IDE\u2019s and editors offer this feature today \u2013 usually done through extensions. For example, the Viasfora<\/a> extension for Visual Studio has provided this feature for many years. What\u2019s interesting about all these implementations is how they all do things a bit differently. Granted, they all colorize bracket pairs, but the way they do it differs and a lot of them provide additional features and options.<\/p>\n

A feature request<\/a> on the Visual Studio Developer Community is also now gaining steam asking for colorized bracket pairs, so please vote and comment<\/a> if you agree.<\/p>\n

So, with increased interest and multiple viable solutions, what would the right implementation look like for Visual Studio users?<\/p>\n

Let\u2019s do an experiment to find out.<\/p>\n

The experiment<\/h2>\n

We\u2019re starting out with an extension to kick off the experiment. We call it Rainbow Braces<\/a> and the first iteration adds basic colorization to curly brackets, square brackets, and parentheses (see image above).<\/p>\n

\"Image<\/a>\nFigure 1: Colorized bracket pairs in both light and dark theme<\/em><\/p>\n

It has four unique colors that it will cycle through and repeat for as many levels deep as needed. The colors work equally well for both light and dark themes and can be customized in the Fonts and Colors<\/strong> options page.<\/p>\n

\"Image<\/a><\/p>\n

You can easily toggle the colorization on and off from the Edit -> Advanced<\/strong> top-level menu. Or use the keyboard shortcut Ctrl+Shift+9<\/strong> to execute the Toggle Rainbow Braces <\/strong>command.<\/p>\n

\"Image<\/a><\/p>\n

Next steps<\/h2>\n

If this feature is interesting to you, please install the Rainbow Braces<\/a> extensions and take it for a ride. Make sure to share any ideas and bugs on the GitHub issue tracker<\/a>, and feel free to send pull requests too. The feature request ticket<\/a> is a suitable place to share your comments and thoughts, so make sure to vote and comment there as well.<\/p>\n

Do you like the idea of community experiments like this one? Let us know in the comments below.<\/p>\n","protected":false},"excerpt":{"rendered":"

When dealing with deeply nested brackets in Visual Studio, it can be hard to figure out which brackets match and which do not. For people with color blindness or other optic maladies, the problem can be even worse. By color-coding bracket pairs, we\u2019re making this much easier. Various IDE\u2019s and editors offer this feature today […]<\/p>\n","protected":false},"author":642,"featured_media":246978,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[561,155],"tags":[229,6862,294],"class_list":["post-239280","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-open-source","category-visual-studio","tag-accessibility","tag-experiment","tag-extensions"],"acf":[],"blog_post_summary":"

When dealing with deeply nested brackets in Visual Studio, it can be hard to figure out which brackets match and which do not. For people with color blindness or other optic maladies, the problem can be even worse. By color-coding bracket pairs, we\u2019re making this much easier. Various IDE\u2019s and editors offer this feature today […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/posts\/239280","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/users\/642"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/comments?post=239280"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/posts\/239280\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/media\/246978"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/media?parent=239280"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/categories?post=239280"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/visualstudio\/wp-json\/wp\/v2\/tags?post=239280"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}