A simple extension to make indentation more readable
This extension colorizes the frames around indented text, alternating different colors on each step. Some people with dyslexia say it helps them get around unfamiliar code.
Works both with standalone Visual Studio Code as well as vscode-web (github.dev). Get it on Visual Studio Code Marketplace.
This extension is a reworked version of oderwat's indent-rainbow.
It uses the current editor window tab size. In addition, it visibly marks lines where the indentation is not a multiple of the tab size, or tabs are mixed with spaces. The visualization can help to find problems with the indentation in some situations.
Although you can use it as it is, there is a possibility to configure some aspects of the extension. The simplest way to do this is via extension settings:
You can add the following setting overrides to your local
Note: Defining both
You can configure your own colors by adding and tampering with the following code:
You can also use colors in RGBA format (
Hiding error highlighting
By default, this extension highlights the following types of indentation errors:
In some cases indentation that breaks these rules is not an error. You can
define regular expressions that instruct the extension to hide error hightlights
for matching lines. By default, errors are hidden for lines with JavaDoc/JSdoc
Skip error highlighting for some or all languages. For example, you may want to
turn the indent errors off for
Build the extension with: