How can you change the block relation line colors in VS Code

Viewed 1625

I am trying to see if you can update the colors for each block relation line. Similar to how Bracket Pair Colorizer works. Nothing is more annoying than tracking the same color line down. As you can see in the pic they are all light gray. I would like a couple of different colors... like grandparent = light green, parent light blue, child light red - repeat down. Is this possible?

enter image description here

1 Answers

You can configure the Bracket Pair Colorizer extension to support HTML by updating the bracketPairColorizer.consecutivePairColors setting.

Add the following to the configuration to support HTML as seen below.

  • ["<", "</"]
  • ["<", "/>"]

settings.json:

"bracketPairColorizer.consecutivePairColors": [
    "()",
    "[]",
    "{}",
    ["<", "</"],
    ["<", "/>"],
    [
        "Gold",
        "Orchid",
        "LightSkyBlue"
    ],
    "Red"
],

Result:

enter image description here

Related