Adding Custom Fonts to Notion: A Step-by-Step Guide for Personalization

Learn how to enhance your Notion experience by adding custom fonts. Follow our step-by-step guide and make your documents stand out.
Notionry
We ♥ Notion
Header image

New to Notion?

Check out Notion's new template marketplace and find the perfect template for your needs!

How to Add Custom Fonts to Notion

Notion is a versatile note-taking and productivity tool that offers a range of built-in font options. However, if you want a specific look that reflects your personal style or brand identity, you can add custom fonts using a third-party workaround. This updated guide explains how to integrate fonts from Google Fonts into your Notion workspace with Notion Enhancer.

Note: This method involves modifying Notion using third-party tools. While many users have successfully customized their setup, these changes might not be officially supported by Notion and could be affected by future updates.

Using Google Fonts as a Workaround

Google Fonts provides a vast collection of free fonts that you can integrate into Notion via the Google Fonts API. Follow these updated steps:

  1. Choose and Embed the Font

Visit the Google Fonts website and browse the collection. Select the font you want by clicking the “plus” button next to its name. Once selected, click the “Family Selected” bar at the bottom of the screen.

  1. Customize the Font

Adjust options such as weight, style, and character sets. When you’re satisfied with the settings, click the “Embed” tab. This tab provides you with the code needed to incorporate the font into your projects.

  1. Get the Embed Code

In the “Embed” tab, you’ll see an embed snippet. Often this is an @import URL or a <link> tag. Copy the code using Ctrl + C (or Cmd + C on Mac). For example, the snippet might look like:

@import url('https://fonts.googleapis.com/css2?family=YourFontName:wght@400;700&display=swap');

Replace YourFontName with the actual name of the font.

  1. Install Notion Enhancer

Notion Enhancer is a third-party plugin that expands Notion’s capabilities by allowing custom CSS and other customizations. Visit the official Notion Enhancer GitHub repository for installation instructions on your operating system. Always check for the latest version and recommendations, as the project is actively maintained.

  1. Add Custom CSS

After installing Notion Enhancer, open your Notion workspace and click the gear icon to access the enhancer’s settings. Scroll down to the “Custom CSS” section. Paste the embed code you copied from Google Fonts, then add a CSS rule to apply the new font across your workspace. For example, you might add:

body { font-family: 'YourFontName', sans-serif; }

Ensure you replace 'YourFontName' with the exact font name from the embed code. Save your changes.

  1. Apply the Custom Font

Refresh your Notion pages to see the updated font applied globally. Remember that the custom font will only appear on devices with Notion Enhancer installed. Pages opened on devices without the enhancer will revert to Notion's default fonts.

By following these steps, you can personalize your Notion experience with custom fonts that better match your style or brand. Enjoy the enhanced flexibility and creative control over your workspace!

Did this page help you?
Share this post