Custom invisible character rendering in VSCode?

Viewed 218

I know in VSCode you can set editor.renderWhitespace to "all" to render whitespace character such as space or tab. Is there any way I can change the symbols used? Thanks :)

Edit: I've been thinking about creating a font that changes · and , but I only need them to be changed in the invisible characters, I'd like to keep my current font for normally.

1 Answers

A solution using homemade font:

Note: It work only for spaces (not for tab character)

  1. Create your homemade font with custom whitespace characters (you can use online tools like https://www.glyphrstudio.com/online/)

  2. Install created font on your OS

  3. Update VSCode settings in order to use your font and disable whitespace rendering:

"editor.renderWhitespace": "none"
"editor.fontFamily": "replaceWithYourCustomFontName, Consolas, 'Courier New', monospace"

Result (using a font with little smiley as space):

enter image description here

Related