Text is blurry

[MiniMindGames.com]

Why Phaser 3 text is blurry?

As an example, see the text "1. White to play" at https://gamequack.com/en/beginner-chess-puzzles/

Pixel rounding seems to improve a bit, but it's still not perfect:

Quote

this.cameras.main.setRoundPixels(true);

 

[MiniMindGames.com]

The more searching the trickier it seems ? ... so it might be good to switch completely to bitmap fonts and then try to cope with all kind of horribleness that brings, such as:

• Disable user zooming of viewport, like user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, minimal-ui=1, shrink-to-fit=no
• Game.scale.mode: Phaser.Scale.NONE to disable scale manager
• Game.render.antialias: false or in CSS image-rendering: pixelated/crisp-edges
• Position images on crisp pixels: scene.cameras.main.setRoundPixels(true), which means that text should not be on the same scene as slowly moving sprites.
• Load images based on window.devicePixelRatio and then downscale with Game.scale.zoom or GameObject.scale.
• ...