Typography - Ultimate Design System Breakdown (Font Sizes, Text Style Naming, Responsive Scaling)

[@hooniexp]

Here's a free Figma template that includes the data insights from this video and a pre-built type scale that you can use to get started quickly! bit.ly/3OdnTRf

[@srdjan.despic]

Thanks for including this resource 🙌

[@rohitg8x]

Thanks, This is really helpful

[@thewishnary]

Thank you so much buddy🎉❤

[@Z-SparkLabs]

omg dude I cant believe this video is 2 year old. I was looking for this EXACT thing like 3 months ago. Thanks so much!

[@nguyenle_e]

Randomly come up with such helpful video. Hope that you can release more series when you have time. Thank you!

[@mayararodrigues1066]

This is by far the BEST content regarding typography I've ever found ( and I watched more than 10)

[@astromessy]

I was probably blessed by the design heavens to have your videos recommended to me so early in my UX/UI career. The information you organized in this video are super insightful and the hard work you went through extracting this data for us is amazing. Subscribed, liked, and will now follow more of your stuff closely 👾

[@safsafaf2838]

HOW can this video have only 480 views? This is such a nice video! Thank you so much! Definitely going to sub!!❤🎉

[@hooniexp]

I appreciate your support. Thank you!

[@mattiaGl90]

Behind this video, there is a lot of work. High levels. Greetings from Italy

[@zoranrnjakovic88]

Thank you so much ! Your explanation was extremely clear and well-presented. I really appreciated your calm demeanor throughout. The way you discussed typography and how to define different size scales was incredibly helpful.

[@NadjibIxe]

Bro! This is one of the best typography videos here on KZbin! You should definitely make more videos, bro! Please xD

[@hooniexp]

Haha thanks Nadjib! I just posted a new one for spacing :)

[@reinoldg]

I've been looking for a video like this one for ages. Thanks for taking the time and looking forward to more content like this one.

[@hooniexp]

Sure thing Reinold!

[@jirowang110]

The exact breakdown that I needed! Thank you

[@joelozkesen8018]

this was so easy to understand! compared to some explanations that get you to lose info rather than make

[@TroTrades]

Hey how's everything going? This is a really underrated channel and is quite honestly the most informative and is actually backed by data. Would love for you to continue making more videos regarding best practices. Cheers!

[@bigpunchline]

This video is everything. Watching it second time now (first time was months ago when i never realized what the hell is is 😁)

[@CoolIntellect]

Same 😊 and after learning the basics, this is the gem for us 💎. Right? Huge thanks to this man who made our work easier. 🙏

[@Michael.design]

Dude you made one of the best videos on typography ever on KZbin! Such clean minimal and clear approach. Please make more videos if you have the time and motivation for it:) Cheers!

[@hooniexp]

Thanks Michael! Just dropped another one for spacing :)

[@Michael.design]

Amazing! Gonna study it soon! Thanks a lot again! Is there a place to see more of your work? From what I can see you also have a preference for minimal and clean design am I right?@@hooniexp

[@sylviakwon]

Great content! So much information! Also your voice is so soothing. Looking forward to more :P

[@hussamaladdin8469]

The video is super well made! Underrated video!

[@hooniexp]

Thank you Hussam!

[@anastasiia_vlasenko]

The best and most informative video about typography! Thank you for your efforts to make it!

[@marktmcewan]

This may be the best video I have ever seen on youtube. Great work.

[@dkachino]

You can tell this was a lot of work. You just saved me a lot. Thank you.

[@daguttt]

The video I've ever wanted to watch about Typography

[@hooniexp]

I appreciate it Daniel!

[@Michael.design]

Exactly this!

[@antonsavitskiy2738]

Good job ! Give this guy gold button !

[@DanielSoto101]

Thank you so much for adding all of this organized comprehensive valuable information. I really appreciate this. It’s amazing.

[@johnpixle]

Amazing stuff, we need more of these!

[@tayyabsohail8823]

I really was waiting for such a video. I was so confused about font sizes I study multiple font sizes of material ui, ant design, HMS but couldn't understand which should I go through.

[@beta_byte]

Bro the quality and value of this video was unmeasurable, hats off to you and keep it up!

[@Jishnucreations2021]

A great hardwork is visible here. Thank you very much for creating a brilliant video on Typography.

[@gabrielcrisostimo]

From nerd designer to nerd designer, thank you so much for this research and data!

[@davedesigns4you]

Hey man! Don't stop please... Keep updating videos! You're amazing... One of kind!

[@KaioFialho]

That was an amazing and really insightful research you've made! Thanks for sharing :)

[@santoshsonnad99]

One of the best and finest video on the typography design system. Very clearly explained. Kudos to you👏

[@oight]

this was amazing and so easy to understand, thank you! hopefully this gets more views xx

[@hooniexp]

Thank you!

[@opsnax1468]

Thank you so much I recently watched alot of videos about typography but I was stucked in such methods behind typography. But your video helps and alot and cleared my all confusions about display fonts sizes or major rules etc. ❤️❤️❤️❤️❤️❤️

[@fayemidavid186]

I can't believe this is so hidden I almost missed it. Love the explanation, it's so detailed and simple to understand

[@ravirajputdesigner]

Fantastic what a deep thought... Thanks @Tim, You saved my years. I have never found these details on the internet. You cleared all the confusion about the importance of typography in the Design System. 💙

[@life-w4v]

Hey there! I just wanted to let you know that your video on typography was incredibly helpful and informative. I really enjoyed it!

[@aloysiofranca]

The best video about text on the internet!

[@julieturgeon5721]

Thank you for all of the work you put into analyzing and sharing this information with us!

[@olivierleirman411]

Very nice approach! I would love to see more videos like this for a lot of design topics like padding (desktop vs mobile etc), colors, naming conventions... But also general ways of approaching design challenges, like how companies design their tables, forms, calendars, profile setting, content cards...

[@nobody-bt7mu]

This is what I call top tier content.

[@kishorekumarseenivasan]

thanks for providing such an informative video, straight to the point, god bless you :)

[@mubindidit230]

This was a pure knowldge based video. Loved every single of it :)

[@DyecksRF]

Excellent video! Congratulations on the work!

[@michellepace]

Lovely explanation and presentation, thank you - very useful !

[@Rnkwrk]

Thank you for the big amount of time and effort you put into this comparison

[@hooniexp]

Glad to hear that it helped you save time! Thanks

[@adams.george]

This is amazing! Brilliant analysis. It'd awesome if there's a cheat sheet of this

[@arunkumarrathod5514]

Thanks for the video Tim! I just created my first typescale. This video helped me a lot.

[@berbooo]

Dude, you are amazing !!

[@oliobiodira5423]

Thank you for taking the time to break it down, so much value!

[@joshuacrownwell-omueti5602]

This is the video I needed. You've made my day man, thanks😊

[@vasiovasio]

Objective and Valuable Overview! Thank you, Hoonie! p.s. Roboto For Life! :)

[@Devsdot]

warmly appreciate your efforts great values+ easy to digest, lots of love from me keep sharing this type of values...

[@jamsonmsuzi9645]

a video that covers alot in typography..... Great Video

[@hiddenfox-pq7hj]

So much value in a single video.

[@kaithainkha4811]

This is such a gem! Thank you so much! I hope you will do Colour Schemes next!

[@cfoxx]

The best video on this topic, thanks for all the research

[@CarlyCorcoran]

Awesome vid and research, thanks for all the effort you put into this, super helpful.

[@loveeco1450]

Insanely high quality content✨✨

[@CoolIntellect]

Wow, It's superb! Thanks for this huge value! Really appreciate it!

[@jopperdepopper]

I'm really impressed by your work and presentation! Very complete and thorough. Great helicopter view on a complex subject. 👍

[@hooniexp]

Thank you for your feedback!

[@frankvasquez4827]

Wooooow!!! 👏 Nice research and presentation!. Now what I would love to see in more detail is that Airtable doc, specially for the naming conventions 🤯

[@hooniexp]

Thanks Frank! I’m working on releasing the AirTable on Gumroad soon. Stay tuned!

[@zeno567_8]

Amazing bro

[@vahidbazzaz]

It was definitely helpful; much appreciated!

[@DevonFrohne]

Really fantastic breakdown! Great work.

[@j1nyng]

I’m so glad I discovered you :3

[@hooniexp]

Thanks for stopping by Kevin! Feel free to lemme know if there's anything else you'd like to see.

[@Channel-bg2st]

Really helpful video. Thank you. Hope to see another one from you :)

[@ngcmng7039]

thanks a lot for spending time to research and doing this video, love to see more in the future😄😄😄

[@hooniexp]

No problem! Ty for watching 🙏🏻

[@igorkhomenko2508]

Thanks so much for the stats! Supper helpful even a year later...

[@Anupss100]

God damn. This was so much useful. Appreciate the effort. Why not publish more videos

[@yxyxs]

So thorough! Thanks bro!

[@kodeeshankodeesh8749]

You're amazing, valuable insights 👌

[@iamrajatsinghpatel]

Great video man! Keep'em coming!

[@jackwalsh6487]

Great vid! Thanks so much for putting this together.

[@angelherrera4984]

Really useful data bro! Thanks for sharing 🙌

[@himanshusawarkar26]

wow amazing video with such detailed content, and easy explation.

[@alenkh2430]

Great job in the analysis.👍

[@valeelghaouth6904]

Thank you for all the work, can you do one for grids and columns?

[@kamalsomani285]

Great stuff.. looking for more such insight full content.. next could be related to Colors

[@samuelerbo]

Amazing content. Super helpful thanks so much for sharing.

[@josecarlosvillalba4261]

Awesome explanation! Thank you!

[@modelhive]

Bro! This is great work.

[@SketchbookStudioo]

This is super helpful, great content. Thanks

[@Sheinkoko-i1b]

Its really informative for me

[@yaoweiyr]

Thank you! This video is really really helpful!

[@brycebyte]

Yo great video, first off. I was hoping you’d say something about how much of a dramatic range there was (nearly double) in the base size of display and body fonts. While there seems to be rough cohesion in other areas, this was a break from that trend

[@hooniexp]

Thanks Bryce! Yeah that's a good call out on that range. I'm assuming that the display range is all over the place since it's more for expressive needs versus the body fonts which seemed to fall more under the functional bucket. I also think that if I increase the sample size, it might help clear up which values are the true outliers in the ranges.

[@MikeTrif]

Amazing work!

[@hooniexp]

Thank you!

[@instant_mint]

Very helpful! Appreciate it!

[@sunilgarbuja]

Thanks heaps! Amazing content! 🔥

[@ftheg99]

i love your two videos - would you please make one around color?

[@justingiovanetti]

I question if level of heading should have anything to do with scale. Think about drum notation. We’re able to easily distinguish between half, quarter, eighth, etc not by the size of the note, but by the symbol, moreover by the extension of previous symbol. No need for a reference point.

[@malakusama5735]

Great work!!

[@sifatraihan351]

This was so helpful, thanks man

[@AbdulWahab-pk4jx]

This video is amazing ❤

[@serenajuhuisuh]

Loved the video. To clarify, at 3:30, are those numbers for each design system? And is that per screen size or including responsiveness?

[@humairanaeempasha2362]

Wow this video is super helpful thanks!

[@SigmaLance3375]

This is golden.

[@anasbinzia8066]

Dude!! Really appreciated!

[@hooniexp]

No problem Anas!

[@soheltamboli2453]

Thanks a lot for valuable information👍🏻

[@AnuragShukla-d5o]

can you give the airtable ? for analysis

[@hoathuan.d]

Thank you so much!