In this tutorial we'll use the font utilities provided in Next.js 13+ to load custom fonts locally and from Google Fonts. The Next.js font utilities provide multiple optimizations out of the box - Google Fonts are downloaded and self-hosted to improve performance and privacy. Additionally, preloads are used whenever necessary and good fallback fonts are picked with modified styles to prevent any layout shift while your font is loading.
Contents:
0:00 Introduction
0:37 Google Fonts
1:29 ClassName Usage
1:50 CSS Variable Usage
2:17 Local Fonts
2:59 Using Multiple Fonts
4:09 Conclusion
Social Media:
Email: [email protected]
Twitter: / nikelaz
LinkedIn: / nikola-lazarov
#nextjs #course