Automating responsive typography in Figma with variables and modes.

Want to stay up to date on new developments, tips and tricks? Make sure to follow me!
And don't forget to subscribe right here on Youtube for more!

00:00:00 - Introduction
00:01:05 - Setting up modes
00:04:44 - Use multiple modes at once
00:04:59 - Change from iOS to Android with modes
00:05:15 - More tips and tricks

Figma just released variables for typography styles. Let's find out how we can use this and add some variable modes to create responsive typography across different screen sizes.

[willpricestudio]

This video helped enormously. Thank you.

[Deckard]

Really nicely explained! Watched a couple of other videos explaining this concept and they were far too long and making things necessarily complicated.

[tanyacequi]

This is great! But how would you add another layer of complexity: brand modes: let say we want to have this set working for different brands or sub-brands… I guess it’s a matter of creating another brand collection, but how do you manage the different typography sizes for every brand?

[rjabrm]

No one works with variables, stop investing in it..