How to turn on invisible characters in VScode

A quick guide to turning on invisible characters in VScode

By default, VS Code doesn’t display invisible, or whitespace, characters. It is easy to turn on should you need it. You can enable it from inside the application and it persists between sessions and projects. By default whitespace characters will only show when text is selected or highlighted.

To enable invisible characters at all times on iOS go to your settings page; Code -> Preferences -> Settings.

Or if you prefer keyboard commands + ,.

In the search bar on the settings page, search for Render Whitespace and with the dropdown that appears select all, this will then show all whitespace characters. From this selection you can also control other whitespace options such as turning off highlighting altogether.

Why would you show invisible characters in VS Code?

The most common reason is that all whitespace characters look almost identical to the human eye, but are interpreted by computers very differently. This can lead to issues when you’re copying code from one place to another, especially in languages that care a lot about whitespace.

If you’re having a hard time understanding why a line of code is throwing a syntax error, try turning on invisible characters and seeing if that is the reason.

Prefer a video?

Toby recorded a video for those folk who prefer to watch rather than read!

Recent posts View all

VS CodeWeb Dev

Select multiple lines in VS Code

How to select multiple lines to edit at once within VS Code

VS Code Web Dev

Move a line up or down with VS Code

A quick tip on moving lines up or down a file using your keyboard in VS Code