Font size displaying larger in browser than in Figma

The font size is display larger in the browser than in figma - see screen shot. It’s noticeably larger. Figma is set to 100% zoom level. No zooming or anything with browser.

So thought the font use in the browser was just larger, so took a screenshot and dragged it into figma, overlaying it on the font style directly in figma. It’s the same size.

Can only think it’s something render related, but the different is to large to be a render issue. Or is 100% in figma smaller than the browser, which doesn’t seem like that would be the answer. Dunno, I’m completely lost. Can anyone help explain what is going on here?

Many thanks

1 Like

An update. Discovered that when viewing the figma file in the browser all the font sizes are the same, however when compared to the desktop app, they are smaller within the app. I’m primarily using the desktop app to design in, and can’t find any settings that have been adjust which would affect the scale of either the app or browser. I’m using an mac running macOS Catalina. 10.15.6.
Thank you.

1 Like

Discover a solution and posting for anyone who has a similar issue.

Within the figma desktop app there is an Interface scale feature. Found here View > Interface Scale
Which you can scale the interface to be larger or smaller. Had the interface scaled down, reset to default to fix issue. View > Interface Scale > Reset to Default
Fonts now the same as in browser.

While this feature helps to reduce the interface size, as a user would not have expected it to scale the canvas and its frames/groups etc so that they are not truly reflective of their zoom level. Would have expected the zoom level to control that so it always looks like you would expect when designing for whatever size. It’s very frustrating and resulted in a quite a bit of work to fix.



Thank you for sharing this, I was going crazy trying to figure out, what the problem was! Took me half a day to find this!

i don’t have that option :frowning:

On Windows, the interface scale settings are located in the additional menu, which is located at the top right (near the “Minimize / Maximize / Close” buttons).

1 Like