UI zooming is blurry

[DimaGashko]

Sorry if there is a such issue already haven't found it.
I don't know if zooming was implemented with css transform scale from the beginning or not, but not it is and it's really bad. I'm sure that when I was adding icons in the past I was able to zoom them whatever I want and they were ideal (what is expectable, since it's svg), but lately when I zoom in a lot the svg became blurry, so I can't really see what is changing when I change the options.
I think is obvious that blurry zooming for an SVG tool is just unacceptable. If it was done for some kind of optimizations I don't think it should be turned on by default.

[Jackky90]

Noticed the same in Chrome recently. It has come with one of Chrome updates. Don't know what actually causes that weird behaviour and, that's interesting, in the Edge (latest ver), where is also chromium under the hood, all displaying properly as it should be.

[tedw]

Same, I had to switch to Firefox.

@jakearchibald FWIW I noticed if you replace <iframe class="svg-frame" src="data:image/svg+xml…"> with a div containing the SVG markup it looks sharp again. Perhaps this is a Chromium bug related to data-uri encoded SVGs and transforms 🤷‍♂️.

---

UPDATE: Looks like this happens in Chrome when you have an iframe with a data-uri src. Here’s a demo: https://jsbin.com/bogenuv/edit?html,css,output

This doesn’t seem to happen when using an <img src="data:image/svg+xml…"> tag, just an iframe.

[tedw]

I wonder if it’s related to this? https://issues.chromium.org/issues/40827297

(I’m using a 2023 MacBook Pro M2)

[Alex-1701]

issue still actual

MacBook Air M2, MacOS 15.1.1
Chrome 131.0.6778.86 - blurry
Safari 18.1.1 - blurry
Firefox 132.0.2 - perfectly sharp