# Change the default font on your site

**URL:** https://meta.discourse.org/t/change-the-default-font-on-your-site/21282
**Category:** Site Management
**Tags:** how-to, customization
**Created:** [January 28, 2019, 1:54pm UTC](https://meta.discourse.org/t/change-the-default-font-on-your-site/21282 "2019-01-28T13:54:00Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![Discourse](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/discourse/32/148734_2.png) [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [January 28, 2019, 1:54pm UTC](https://meta.discourse.org/t/change-the-default-font-on-your-site/21282/1 "2019-01-28T13:54:00Z")

</div>

> 🔖 This guide explains how to change the default font on your Discourse site, either for specific elements or by using a font library other than Google Fonts.
> 
> 🙋 Required user level: Administrator

> ℹ This guide is only needed if you want to integrate with a font library other than Google Fonts or to change the font of only some elements of the site. If you are using Google Fonts and want to change the font globally across your site, try out this theme component instead: [Google Fonts](https://meta.discourse.org/t/google-fonts-theme-component/143720).

This guide will cover:

- Using the built-in font settings
- Changing the site font with a custom font
- Applying different fonts to specific elements

## Built-in font settings

Discourse includes a built-in font picker with a selection of bundled fonts. This is the simplest way to change your site’s font without any custom CSS.

Navigate to `Admin > Appearance > Fonts` to access the font settings page. From here you can set:

- **Base font** — used for most text on the site (default: Inter)
- **Heading font** — used for headings (default: Inter)
- **Default text size** — the default text size for all users

These settings use the `--font-family` and `--heading-font-family` CSS custom properties under the hood, which themes can also override.

## Changing the font with a custom font

If you want to use a font not included in the built-in list (e.g. from Google Fonts or a self-hosted font file), you can do so via a theme component.

1. **Create a new theme component**

2. **Edit CSS/HTML**

3. **Add the font using Google Fonts**

4. **Apply fonts to specific elements**  
You can also change the site font to just some elements.

5. **Add the new component to main themes**

> Last edited by @SaraDev 2024-07-16T19:44:44Z
> 
> Last checked by @sam 2026-03-18T04:24:33Z
> 
> > **Check document**
> >
> > Perform check on document: