In Windows, Google Chrome browser suffers from font bad rendering, with fonts being too thin and washed on screen. I don’t really know the technical cause, but it seems related to antialiasing and how the fonts are drawn, maybe a DirectX Graphics misuse.
Visual Studio Code is built upon Electron infrastructure, which in its turn uses Chrome engine to render stuff. So, VSCode suffers from the same problem: fonts being too thin and bad to read. Writing source code in such an environment is hard on the eyes. Until this day, I simply used Consolas font, which is naturally thicker. But I was never satisfied.
On Chrome, I fixed the problem by using Font Rendering Enhancer extension. It’s a rather simple extension that just adds the following style everywhere:
* {
text-shadow: transparent 0px 0px 0px,
rgba(0, 0, 0, 0.5) 0px 0px 0px !important;
}
The variation occurs in the 0.5 value: the higher the value, the darker the fonts will be rendered.
At some point, I also started facing the same problem on Firefox, and I asked about it on Reddit. Then I used addon to apply the style globally, and the problem was solved.
Now, back to Visual Studio Code, I started wondering whether it would be possible to add a global style to the whole window, since it’s just a browser window, after all. Turns out it’s possible by directly injecting CSS into Developer Tools, but it will go away when you close VSCode. Now, to make this change permanent – at least until the next update –, we can edit the main CSS file of VSCode and inject the CSS snipped globally. The file is:
(install dir)
resources
app
out
vs
workbench
workbench.desktop.main.css
There’s a side effect, however: when opening the VSCode again, you’ll receive the following warning:
Your Code installation appears to be corrupt. Please reinstall.
What means VSCode checks its own files when it’s launched, and that’s good, given the amount of garbage that an Electron program has. You can ignore this warning though, although there’s a very remote risk that something bad was actually injected into your VSCode installation without your consent, and you’ll be vulnerable. But it would be a very rare event, indeed. You’ll also see “[Unsupported]” in the titlebar.