"A web with web fonts is more beautiful, readable, accessible and open."

— The Google Fonts Team

Everyone loves unique and creative fonts. Everyone, but the folks who are missing them. In a nutshell, you need to install more popular fonts such as those that are part of the Google Fonts directory.

Sometimes you open a Sketch App file and immediately see the dreadful "missing fonts" warning. This typically happens because the original creator used fonts that you don't have. At this point you have two options:

Sketch App Some Fonts in the Document are missing

1) You could "Open Anyway..." the Sketch App file but all missing fonts will be replaced with Lucida Grande and you may observe alignment and line-height issues. Not a chance, at least not for me.

2) You can also "Close" the Sketch App file, search and install the missing fonts, and then reopen the file successfully. In this case, your favorite font manager and Google search are your best friends.

Sketch App and Google Fonts

A quick search for Roboto Slab reveals this is a free font by Christian Robertson available in the Google Fonts catalog.

We observed that the majority of missing fonts in Sketch files are Google Fonts. At this moment there are 684 free font families and over 1600 free fonts in the Google directory. All fonts in the directory are free and open-source. This means that anyone can use them in every way and shape they want. The fonts can be used privately or commercially — in apps, in print, or in websites.

Additionally, popular websites, such as Fonts.com, have partnered with Google to offer free fonts to the masses. As a result, Google Fonts are widely distributed and a growing number of designers are using them.

If you have Google Fonts pre-installed, you would most likely see less "missing fonts" warnings. How do you go about downloading and installing each and every font? Well, you can download the fonts from the official Google Fonts GitHub repository, but there is a better and more time-efficient way.

You can download and install all Google Fonts (~500MB) at once thanks to Quinton Pike and Peter Stacho.

All you have to do is enter the following command in Terminal.

curl https://raw.githubusercontent.com/qrpike/Web-Font-Load/master/install.sh | sh

Download and Install all Google Fonts at once

If you wish to update the fonts, you will need to re-run the same script. The script will overwrite duplicates. Please note that you may need to restart for Font Book to pick up the new fonts.

If you wish to uninstall all Google Fonts, check out Quinton's GitHub page for more information. Uninstalling is as easy as installing.

-----

Some Fonts in the Document are missing

The following fonts are used, but cannot be found on your system:

Fonts-You-Wish-You-Had

If you choose to open the document anyway, the missing fonts will be substituted by other font.

  • iterate on designs
  • discuss with others
  • don’t be afraid to try a design
  • plan ahead before starting on a complex image

We hope you enjoyed learning about Smartly and the Pedago team. You can connect with them on Twitter and on their website.

Go back to the previous page

This post is prepared by Todor Iliev. If you enjoyed this, follow Sketch App Sources on Twitter for updates. We invite you to check out the selection of freebies and contribute files, plugins, articles, and tips with the community.