How to use System fonts in Figma, Webflow and Code?

Here a journey through the use of system fonts with different tools such a design environment (Figma), a web builder (webflow) or just with code.

“Everything you load on the page has a cost. This cost is especially important for mobile devices, because every byte required on a mobile device affects the load time and the amount of bandwidth consumed by the user. The font must be loaded before the content is rendered, so you need to wait in order to complete the resource loading before the user can even read the single word you wrote. But web

--

--

Design Technologist. FrontEnd | DCO | Display | Webflow | UXR | UXDesign | Writing | NoCode | Lifelong learner | Photographer | Runner | Traveller

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
fernandocomet

Design Technologist. FrontEnd | DCO | Display | Webflow | UXR | UXDesign | Writing | NoCode | Lifelong learner | Photographer | Runner | Traveller