VSCode でインデントを分かり易く色づけする indent-rainbow 拡張機能

ryomatsu

5年前

プログラムを書いていると偶にインデントが深くなりすぎて見にくくなる事がある。そのようなコードは極力避けるべきだとは思うが、そうも言ってられない場合も多い。

VSCode を利用しているのであれば、indent-rainbow という拡張機能を利用することでインデントを色分けして分かり易く表示する事ができる。

この拡張機能をインストールすると、以下のようにインデントに階層毎に色が付きわかりやすくなる。

インデントが揃ってなかったりタブとスペースが混在していると警告替わりに色が赤などに変化するのも地味に良い。

表示する色は設定により変更可能となっている。settings.json に以下のように記述して VSCode を再起動すると反映される。

"indentRainbow.colors": [
    "rgba(255,255,64,0.5)",
    "rgba(127,255,127,0.5)",
    "rgba(255,127,255,0.5)",
    "rgba(79,236,236,0.5)"
]

標準の色は透明度が高くやや視認性が悪いので、少し明るくすると良いかもしれない。色はエラー時のものなども指定可能なので自由に設定しよう。

Python などのインデントが重要な言語ではより役に立つのではないかと思う。VSCode でインデントが見にくいなと思ったら indent-rainbow を入れてみよう。