Updated version of this video –
In this video we look at how to quickly set up our typography in Figma for a very easy and efficient workflow in Figma. These tips can of course be applied to any design software that you like to use – I’m just loving Figma right now.
Thank you so much for checking out my tutorial! Please subscribe for more design tutorials – I’ll be covering Animation, HTML email design, HTML email code, Web Design and Web Development with Webflow.
Links discussed in video:
Type Scales:
Figma Lorem Ipsum plugin:
Follow me:
Website:
Newsletter:
Instagram:
Facebook:
Dribbble:
LinkedIn:
Music: “Still Standing” by Anno Domini Beats
Updated video here for you guys – https://youtu.be/eW2-ghXuYC8
I watched almost 6 videos on this topics but wasn't able to find tha answer, but you did that, you just got a new subscriber, keep rocking man❤
nice, but what about spacing between headers and paragraphs?
Thank you for this, I was missing the reasoning what influence line-height. Your explanation was on the point.
I especially liked when you explain the differences with very small text and very large text line height and amount of words.
Thanks
You are a hero Tom. This video practically saved my life. Subbed!!!
Great video but nothing about letter spacing?
But how do you translate those sizes to mobile?
Thanks for this site
Tom is amazing.
Hi Tom. can you explain how to use 2 fonts together? Abput harmony of fonts?. How to choose 2 fonts which can harmony to each other?
This is really useful, thank you for showing this really useful tip!
this works also to mobile design?? I mean, is there another web to guide like type-scale to work in my mobile – desktop tipografy work?
These fonts for desktop right? Then what about mobile font sizes? Pls tell me
Thank you
What’s another option for the Lorem Ipsum plugin cause I can’t find it in my plug-ins community
Would consider Lunacy a decent tool for professional work?. People rarely talk about it.
really super, upload design system
😍😍😍😍
Dam good video
instantly subscribed! I landed on a goldmine
Yeah, I didn't understand anything you said.
Thanks for the video =)
Thanks a lot Sir. That was very helpful.
Excellently super clear instructions, thanks so much Tom! From a print designer slowly going digital here in Sydney Australia : )
So true about the font size! Significant issue which rarely gets considered.
I am making a style guide for a my business for the first time and this really helped thankyou
So great video. Thank a lot. Its very useful for my studying.
Thanks for this video Tom. I have questions, how do you scale typography from web design to typography for mobile design?
Second question, If a component is an H4 in web design, does it also have to be an H4 when translated to mobile design?
What if the H4 scale in the mobile design version does not match the layout size requirement, can we replace it with the closest scale even though it is an H5 or H3 mobile?
Third question, Do headings (H1 to H6) have to be the same typeface? Or is it okay to use a different font, for example: H1 to H3 using Lato then H4-H6 using Nunito.
Thanks in advance. I am very confused about this, would be very helpful if you would share your advice. Thank you again !
What informs how you choose your Scale? Just visual preference?
you can use percent for leading. example: “120%”
Who the hell disliked this video??? Thank you much, very well explained!
The ratio of font style
thank you tom I have been looking for a solution to fix the text thank you
I love your content. I hope you have a video about how to pick typography for a project. How to build that vocabulary for typography.
Please post more tutorials in webdesigsn
Nice
Cheers, Tom. I've also been looking for a simple formula for calculating line-height. Thanks a lot, bro
I love your video. It helped me solve part of my problem
This is EXACTLY what I was looking for!! Thank you!!
Amazing video, thanks a lot. Question on using type scales across media though, should I be using the same type scale across my print and digital designs? For my brand, I have a lot of print designs (packaging, stationary, etc…) in addition to the digital stuff (website, digital marketing). Should I be using the same type scale between print and digital assets?
Thank you Tom! This was helpful
Great Tutorial. I have a question. Is the same scale used for mobile and table?
On a new project, do you always start with the typography and spacing? Is that the first step?
Can this method be used for any screen design?
Thanks for the video Tom! Just one question, how do you determine the spacing between the headings and the body text? Or between different headings?
For desktop as well
For mobile you should design on an 8 points grid, faster, sharper, consistent
Maybe it is "looks rubbish" but you just helped a lot with. Subscribed. Thanks
Thanks, Tom,,, Very useful tip
Thank you Tom, learnt a lot, i would love the same video about color styles
This helps a lot for starting my career. New subscriber.