Changing Fonts

We’re a design-centered studio who shares a real passion for typography and all its characteristics: from admeasurement to spacing until hierarchy. That’s why we have a strong focus on offering you enough room in order to finding the right match between the typo layer and your unique branding approach.

We’ve internally developed Typeline, a smart calculator to accurately and correctly adjust fonts and sizes taking into consideration a wide range of devices and requirements. Thanks to this tool and the automated calculation system we’ve build, now you’re sure you use the right sizes on the right gadgets. One worry less.

Before you start

  • Being consistent regarding the fonts you’re using is essential for your website’s success and healthy evolution. That’s why we’re offering site-wide options to avoid confusing you with a bunch of fonts and sizes per-pages choices.
  • Limit yourself to only a few fonts: it’s best to stick with two fonts but if you’re feeling ambitious, three is the maximum.
  • We recommend you to always use headings in order to create hierarchy and coherence within the structure of one page or another.

Change the Font Style

One size doesn’t fit it all, and you know that. Depending on the nature and the personality of your site, we suggest you different typography options for multiple elements, such as heading, body text, page titles or project titles.

Each option is structured after several common sense rules, as it follows:

  1. Font Family
  2. Font Size
  3. Line Height
  4. Letter Spacing
  5. Text Transform

Change the Font Family

We encourage you to choose from Google’s library of fonts which includes 600+ options. In alignment with the theme, you can use the custom font from our demo.

Change the Font size

All you have to do is to change the font size is to use the range slider. Usually, it has a minimum and a maximum already established, depending on the context. However, please keep in mind that we use an algorithm to calculate font sizes on several devices. This means it sets the dimension on the desktop, and we directly come up with metrics for tablet and mobile.

Use Premium Fonts

If you want to go even further, you can always appeal to custom fonts. You can quickly make that happen through seamless integration with Fonto, our side-project. For further details, you can read this helpful article about this plugin.

Updated on April 20, 2017

Was this article helpful?

Related Articles