fluid-type-scale-calculator icon indicating copy to clipboard operation
fluid-type-scale-calculator copied to clipboard

Fix inter font rendering issue on mac OS

Open AleksandrHovhannisyan opened this issue 3 years ago • 1 comments

Context: I'm currently self-hosting Inter for performance using https://google-webfonts-helper.herokuapp.com/.

Unfortunately, the app is currently using an outdated version of Inter that renders the uppercase letter A with two little weird holes that are very noticeable on mac OS (and only mac). See issue here: https://github.com/majodev/google-webfonts-helper/issues/130.

Workarounds that have come to mind:

  • Don't self-host the fonts and instead link to Google Fonts. Noticeably worse for performance per #8.
  • Use https://github.com/takanorip/eleventy-google-fonts/. Downside: it returns the CSS for all charsets rather than just latin.
  • (Temporary patch) Use different sample text and hope people don't notice 😅 Footer text also contains an uppercase A from my name, so this wouldn't really work.
  • Use a different font 😞 Inter is so pretty though...

AleksandrHovhannisyan avatar Jan 04 '22 23:01 AleksandrHovhannisyan

Idea: just download the woff2s directly from Google Fonts's font-face CSS for Inter.

AleksandrHovhannisyan avatar Feb 06 '22 23:02 AleksandrHovhannisyan

Fixed a while ago, forgot to resolve.

AleksandrHovhannisyan avatar Jan 22 '24 16:01 AleksandrHovhannisyan