sonixd icon indicating copy to clipboard operation
sonixd copied to clipboard

Text looks blurry

Open aqt opened this issue 3 years ago • 0 comments

Describe the bug Text is rendered with grayscale anti-aliasing rather than sub-pixel. This makes it look blurry rather than crisp.

To Reproduce Open the app and look at the text. Bold text emphasizes the problem. If it's still hard to spot take a screenshot and zoom into it.

Expected behavior Text should not look blurry.

Screenshots If you really need it I can grab a screenshot of the application, but this example plucked from the Electron FAQ in Additional context illustrates the problem. Subpixel rendering example

Desktop (please complete the following information):

  • OS: Windows 10.0.19044.2251
  • Version: 0.5.13

Additional context Changing theme or font does not fix the problem, although it's less visible with "Default Dark" than for example "Spotify-like", maybe due to less contrast.

The Electron FAQ addresses this problem and proposes a fix.

Sub-pixel anti-aliasing needs a non-transparent background of the layer containing the font glyphs. (See https://github.com/electron/electron/issues/6344#issuecomment-420371918 for more info).

To achieve this goal, set the background in the constructor for BrowserWindow:

const { BrowserWindow } = require('electron')
const win = new BrowserWindow({
  backgroundColor: '#fff'
})

Notice that just setting the background in the CSS does not have the desired effect.

aqt avatar Dec 04 '22 11:12 aqt