Blurry/flickering text rendering in Electron

Solution 1:

I have an intel HD internal graphics card and finally figured what caused the problem.

Internal graphics users

  1. Open Intel HD control panel
  2. Goto 3D settings
  3. Turn off conservative morphological anti-aliasing
  4. Restart Application and varify

Others

  1. Check for setting in anti-aliasing setting
  2. Disable if enabled
  3. Restart the application and varify.

Solution 2:

Windows and Electron together are a sort of "explosion mixture" in the belongings of font rendering. Windows currently has some issues with hardware acceleration, not only for fonts, but also for other non-Microsoft technologies, e.g. OpenGL.

As described in this issue on GitHub, this problem is known by the developers of both Electron and Chrome (Google) and has to be solved by Microsoft.

I also have this issue on my projects, which render correctly on Linux and do not on Windows with both my AMD and nVIDIA graphics card.

As @Slaiyer mentioned, there is a workaround for the "major" Electron applications, i.e. VS Code or Atom, Code.exe --disable-gpu respectively atom.exe --disable-gpu.