rsms
Font distorts at some sizes
Describe the bug The font is horizontally squeezed (looks vertically stretched) at small sizes. Perhaps it might be how Linux handles font rendering. On Windows, this was not so apparent but still there.
To Reproduce This bug might or might not be reproducible. Still, laying down the best possible steps to reproduce it.
- On Firefox, add all possible zoom levels with increments of 1 starting from say 70% to 120% (100%, 101%, 102%, 103% etc). (This requires editing the
about:configsettings) - Open https://rsms.me/inter/ at 100% zoom level.
- Now try to increase the zoom level and notice the navigation links at the top.
- At some point, the differences in the font would be noticeable.
Expected behavior The font should not distort so much.
Screenshots
I also recorded a video with both outputs overlapped. Toggling them gives a clear view of the change in the font geometry.
https://github.com/user-attachments/assets/3bd4c120-27b9-4469-8a23-6408a8ba04c7
Environment
- OS: KDE Plasma 6.1.5 on Arch Linux at 100% scaling
- Apps: Most noticeable in all major browsers - Chrome, Brave, Firefox
- Font version: Inter 4.0
- Screen: Resolution of 1920 x 1080 at 14.0 inches (157.35 PPI)
Additional context Slight differences in the font rendering are expected due to approximation at small sizes and perhaps fewer pixels available to properly render the font geometry, there are other similar fonts (like Geist, San Francisco, Helvetica, etc) that perform noticeably better and render the fonts without them looking stretched or anything like that.
We've also noticed this. It does not seem to happen on macOS, but it's clearly visible on Windows: https://youtrack.jetbrains.com/issue/CMP-6649/Text-appears-stretched-on-Windows-11#focus=Comments-27-10698121.0-0
This is Microsoft ClearType altering the outlines. Either tune your cleartype to be less aggressive, use fonts without TTF hints or disable cleartype rendering in the software being used (for example font-smoothing: antialiased in a web browser)
