Text Styles using Sketch


Ho ho ho guys!

Hope you had a great Christmas, now it’s time to get back to the grind.

It is great to have a style guide for each project, especially when working in a team. This way, team members can easily take over the project without worrying about interfering with your style. (We wouldn’t want two different styles on a project, am I right?)

Did you know?

You can change all the colours of your buttons and text style of your fonts with a mere few clicks.

As a 3 part series consisting of Text Styles, Shared Styles and Symbols, we will be touching on Text Styles today. Let’s get going!

Here we have 3 different types of text. Title, Sub-Title and the Body copy.

Step 1: Start by clicking on the text and “No Text Style”.

Step 2: Upon clicking, you should be able to change the name of the style. By default it will key in the text of what is selected.

Step 3: Change it to something you can remember. In this case, I will call it “Title”.

Now, here is how text styles will be helpful to you. These text are all assigned to the different text styles.

Step 4: Click on the text to see if there is a text style assigned to it, if not, assign one to it.

Step 5: Change the properties of the selected text, I changed the font size from 30 to 24. After making the changes, click on the refresh icon.

That will change all the properties for the text under the Sub-Title text style.

Hmm.. does it work for colours?

Yes, it does! This saves so much hassle!

Hope you learned something! Stay tune in for more upcoming Sketch tips!