I had setup a simple canvas with a fillText drawn on it. It looks quite good, but when I use the browser provided zooming feature (Safari, Firefox), the antialiasing looks ugly.

I tried to use scale() raise the grid, but it doesn't help.

Is there any way to draw on a canvas that it looks sharp even with a zoomed browser window?

Screenshot (no zoom): https://i.sstatic.net/CGWka.png

Screenshot (max zoom): https://i.sstatic.net/vNPjF.png

javascript css html canvas
Edit
Report