
In this small how to we are going to see How to set vertical rulers with Visual Studio Code.
I know that can sounds crazy but I actually spent time looking for this setting…is not that easy to find. In VI you can just do
:set colorcolumn=80,120,140
And by magic for each line you will write this will appear

With Visual Studio Code I found this to be not so immediate. In fact you should go to
Preferences -> Settings -> Text Editor and look for Rulers
OR
Use the Search settings at the top and type rulers

Click on “Edit in settings.json”
and in the “editor.rulers”: [] you should write 80, 120 and the result should be something like this
"editor.rulers": [
80, 120
]
What this will do is that will add 2 vertical lines, one at the 80th column and the other at the 120th column
You can decide to add more if needed and at the size you prefer.
I hope you found this useful
Share this content: