Hi everyone, in this video we are going to look at this menu here... Type Settings, all these advanced settings that go along with some of the fonts... we're not going to cover everything because some of them are self-explanatory... and some of them are, you know, it's more down the road of...|  Typography and understanding Typography terms... but I want to cover the good ones that you'll need... and that are useful when you're working with Type in Figma, to make UX designs...

kind of a quick overview, and you can dig into the ones... that you find more interesting yourself. The first one is, that they're not all created equal... so I've got three, actually I can count, there's four lines of text here... and what I want to show you is, under these Settings here... Inter is this first font here, it is the default for Figma at the moment...

and I say, at the moment, because they have changed it in the past... so what we'll find is, there is, under Details there is a lot to go through... we'll cover most of them... but if I go to the worst of all my options... this is a free font I found online... I'm not sure why I pick on this Cactus font all the time...

but it's called Cactus Sandwich, and under 'Details', can you see... I'm scrolling up and down, there is no scrolling up and down... so some of these options will be available to your font, some of them won't... there's two reasons, one is, if it's shaped like a cactus...|  it's probably not going to be a very complete font... and the other one is, you may be using the free version... and maybe not the Pro version...

sometimes there's a Pro version of a font that has a lot more depth to it... and often you need to pay for those options... but I found someone that we should all be able to find... these are all Google fonts... and Google fonts are the defaults that are built into Figma... so let's dive in and have a look at some of those advanced settings.

So with Inter selected we'll look at like... the basic stuff, we won't cover, we've kind of covered it all... Details, covered a bit of this... ones that I want to start with are ones that you might not have heard of before... and we're going to start with the most interesting, which is Stylistic Sets... and for Inter this is really boring, can you see the difference up there?

See the A and the &, that might be really important for what you're doing... I know, with my kids in school, teachers are always looking for a font... that has that in it... they end up using Comic Sans, but for us as designers... something that's maybe more interesting, is I've picked a Script font... this one's called Meow script, very professional...

but the cool thing about this is, under the 'Details'... it's quite a like robust font, there's lots of stuff going on in here... let's look at the Stylistic Sets for this... what we might do is just break it out over here... "Where we going to break it out, Dan?" I do not know... there we go, so you, Command, or Ctrl D, D, D...

let's have a look at this one and we'll just compare a few of them. So when this font was designed, the typographer... or team of typographers, I'm not sure who made this one... they made up some other sets, Stylistic Sets... so let's have a look at the Stylistic Alternatives... can you see there, between that and that, so much of it changes...

so you might get to a point where you're like... "I like this font but the A doesn't read well," there is an alternative... a Stylistic Alternative for that font... so let's turn that first one off and look at the different sets... because this is all the alternatives... and this is like a group of them that go together...

there's lots of different options here, so you can turn this one on... see the difference, let's look at this one here, the third one... oh, look how different that is, you might be like, "Yes, that's what I need,"  I like the flow, but all of the whoopy squirly bits aren't working for you. I won't go too much into it, other than... especially Script fonts, often you can find some really cool Stylistic Sets... and build some really cool letter forms, and...

especially if you're trying to do, maybe some Hero text... or some logos, or something a bit more interesting... and just in comparison, that, I found that one because it was reasonably advanced... this one here isn't, so we'll go have a look in here... let's have a look at the Stylistic Sets, there's only one... what does it do?

It's got a Stylistic Set of, looks like Zs only... and our Cactus font doesn't have any, not even the Zs. The next one that's kind of interesting is Kerning Pairs... so we'll use this font, it didn't have any Stylistic sets... but the typographer went through and spent a lot of time with--  let's have a look, under 'Details', let's look for Kerning... there you go, Horizontal Spacing, Kerning Pairs...

it's on by default, which makes it look good... you can turn it off, what ends up happening here, it's interesting to see that... normally the T and the Y are this far apart... that's just kind of them spaced apart as characters... what the typographer said is, if a T, capital T is next to a lowercase y... I want you to tuck in nice and tight, oh, look how good that is...

that's why you might be using some kind of like... I don't know, some plugins in Figma, or using maybe a tool... I know I've got one that I use for my vinyl cutter here... that doesn't apply all the Kerning Pairs. So all the type just ends up looking gross. Same with this one here, I bet you it has Kerning Pairs...

it's only really slight, let's look at this one here, on, off... on, off... nothing going on in that one... I think it could probably use a little bit in places, hey, why would I know... so that's Kerning Pairs. The next one that's in there is called Ligatures...

I'm going to click on the Cushion Script... and with it selected, down here, under 'Details', let's have a look... there's called Letter Forms and there's Ligatures... for those who don't know what ligatures are,  basically what ends up happening is--  let's turn it on and off... can you see that this one, the F and the I, when it's together, the font... and Figma go, "Hey, the typographer said if these two letters are together...

I want you to switch them out to this fancier looking option"... it's the same if there's an F L, can you see, it changes automatically... it's because the typographer said, "I don't want an F and and L to look"... you know, "I don't want them to do this when they get together"... holding 'Option' and using my '<' key to do my letter spacing... can you see, it kind of gets a bit...

what the, what is that now? So they went and said... "All right, let's, when they get together, make ligature magic," oh, cool huh. It depends on the font, some fonts have none... like I know, even this one here, our Inter doesn't have any ligatures... not even the F and the I...

I think that one does, and our Cactus one is definitely not going to... because it's hard to beat perfection, fi. Something else that's quite useful... is when you're dealing with numbers, let's look at two things... so Inter, again, a really complex amazing font to use... because it has a lot of depth...

so with the numbers selected I'm going to go into here... and this one, out of all of them it's the only one that has... what does that have? It has character variants... and what we can see here is, let's--  it's got an alternative one, so let's, actually let's zoom in on this one... let's look at the different 1, you see the 1, oh, look at the 1 change...

pointy, troopy... what about the 4, do you need an open 4 or closed 4? Sometimes, it's not just numbers... watch this, with the actual text here, there's a lowercase tail for the L... you can turn that on and off... so there's so-- I'm not going to cover everything you can do in this font...

it's more to show you that some fonts have a lot of control, some of them don't... that's why picking a good body copy font... can save you some headaches down the road when you... maybe have to deal with different languages, maybe scientific notations... or your client really doesn't like that 6, there we go, pointy 6. The other thing that's useful for numbers...

is let's move down to one of the other ones, this one here... the font that I'm being using, Leto... let's have a look in here, doesn't have the character sets, what it does have... is under Numbers, there's Number Styles... let's have a look at this, let's get back in there, 'Number Styles'... can you see the difference between that, this one...

a lot different different number styling... can you see the differences there, mainly with the 1... then we get into this option where it's monospaced... monospaced is so that we can have different numbers... as long as the same amount of characters, they will line up... can you see, different numbers in there will line up...

and that's not always the case for different fonts, let's say this one here... I'm going to get rid of four characters but type in 1s... because it's not monospaced they're the same amount of digits... but it's really hard to compare them... whereas my Leto, I can turn that on, so it's monospace, it maybe not as tidy... so I can get it down so it all fits in there nicely using this first style...

but I can use this Mono style, and everything kind of lines up nicely... there's other ones in here... have you ever got a font that you're like "I can't, why is it dangling down?"  This one here's probably got more of them... there you go, some of them are up, some of them are down ... I'm not a fan of that style of type... you might want to turn it on...

or you might have a font that you might want to turn it off, on... know that you can, in here... and again they're all going to be different... some will have mono spacing on by default, and there's no way to turn it off... that's why often designers end up falling in love... or at least, safety with a font that they like the look of...

and they know can be quite useful... and they know it's not going to give them headaches later on. That is the rough overview of the things that I kind of look at... in a, not a daily basis... but the stuff that I know is quite useful when I'm working... there's a lot more in there, so have a look around, see what your font's got...

you might have to do some font research and decide... anyway, you're going to push on with the Cactus font... wherever he is, there he is... Cactus sandwich for life, I'm not sure why I'm picking on this font... mainly because I got to ease up on Comic Sans and Brush Script, there you go. All right, that is it, I will see you in the next video.