Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Self-Hosting Fonts Explained - Including Google Fonts - @font-face Tutorial

Kevin Powell via YouTube

Overview

Learn how to self-host fonts, including Google fonts, in this comprehensive tutorial video. Explore the basics of font self-hosting, from obtaining fonts from Google to converting file formats and implementing @font-face rules in CSS. Discover why self-hosting can be a better choice than using Google Fonts directly, especially for users in certain European regions. Follow along as the process of converting .ttf files to .woff and .woff2 formats is demonstrated using the Font Squirrel Webfont Generator. Gain practical knowledge on adding fonts to your project and setting up the necessary CSS rules to utilize them effectively.

Syllabus

- Introduction
- Getting fonts from Google fonts
- The problem with downloaded Google fonts
- Converting from .ttf to .woff and .woff2
- Adding the fonts to a project
- Setting up @font-face rules to use the fonts in our CSS

Taught by

Kevin Powell

Reviews

Start your review of Self-Hosting Fonts Explained - Including Google Fonts - @font-face Tutorial

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.