> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.templated.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Uploading Custom and Google Fonts

Templated includes a set of built-in fonts. On paid plans you can also add any Google Font and upload your own font files (brand fonts).

## Where to find fonts

Fonts are managed in the **fonts panel** of the editor, not in the Uploads tab.

1. Open a template in the editor.
2. Select a **text layer**.
3. Click the **font name** in the toolbar. The fonts panel opens on the left.

The panel has:
- **My Fonts**: fonts you uploaded or added (shared with your whole team).
- **System Fonts**: the built-in fonts available to everyone.
- **Add Google Font** button (paid plans).
- **Upload a font** button (paid plans).

Use the search box at the top to find a font by name.

## Upload your own font (paid plans)

1. Open the fonts panel (select a text layer, click the font name).
2. Click **Upload a font** at the bottom of the panel.
3. Choose a `.ttf`, `.otf`, `.woff` or `.woff2` file.
4. The font appears under **My Fonts** and is applied when you click it.

Good to know:
- **The font name is the file name** without the extension. For example, `BrandSans-Bold.ttf` becomes `BrandSans-Bold`. Rename the file before uploading if you want a cleaner name.
- **Each file is a separate font.** Upload one file per weight or style you need (for example `BrandSans-Regular.ttf` and `BrandSans-Bold.ttf`), then pick the right one per text layer.
- **Avoid variable fonts.** Files named like `BrandSans-VariableFont_wght.ttf` contain many weights in one file and may not render the weight you expect. Upload the static files for each weight instead (most font downloads include a `static` folder).
- Uploaded fonts are shared with all members of your team.
- You can also upload fonts with the API: [Upload a font](https://templated.io/docs/fonts/upload/).

On the Free plan, the upload and Google Font buttons show a crown icon and open the upgrade screen.

## Add a Google Font (paid plans)

1. Open the fonts panel.
2. Click **Add Google Font**.
3. Search for the font and add it.
4. It appears under **My Fonts**.

Not every Google Font is available until you add it. If a Google Font is not in System Fonts, add it first. After that you can use it in the editor and via the API by its name.

## Use fonts via the API

Set `font_family` on a text layer to the exact font name shown in the fonts panel:

```json
{
  "template": "YOUR_TEMPLATE_ID",
  "layers": {
    "title": {
      "text": "Hello World",
      "font_family": "BrandSans-Bold"
    }
  }
}
```

- The name must match exactly (same spelling, hyphens and spaces).
- List the fonts on your account with [List fonts](https://templated.io/docs/fonts/list/) (`GET /v1/fonts`).
- List the built-in fonts with [List gallery fonts](https://templated.io/docs/fonts/gallery/) (`GET /v1/fonts/gallery`).
- For a second font inside the same text, use `font_family_2` with `*asterisks*` around the words. See [Create a render](https://templated.io/docs/renders/create/).

## Arial, Helvetica and other system fonts

Arial is **not** included by default. You can:
- Upload your own Arial file (make sure your license allows it), or
- Add the Google Font **Arimo**, which has the same letter widths as Arial.

The same applies to other fonts installed on your computer, such as Helvetica or Calibri: they are not available in Templated unless you upload them.

## Non-Latin scripts (Hindi, Arabic, Thai, Japanese, Chinese, Korean and others)

If text shows as **empty boxes** (also called "tofu") or question marks, the font does not contain the characters for that language. The renderer does not automatically switch to another font.

Fix: use a font that supports the script. For example:
- Hindi, Marathi, Nepali (Devanagari): add **Noto Sans Devanagari** with Add Google Font.
- Arabic: **Noto Sans Arabic** or **IBM Plex Sans Arabic** (built-in).
- Thai: **Noto Sans Thai** (built-in).
- Japanese: **Noto Sans JP**. Korean: **Noto Sans KR** (built-in).
- Chinese: add a Noto Sans SC or TC font with Add Google Font.

Right-to-left languages (Arabic, Hebrew, Persian) are supported. Text direction can be set to Auto, LTR or RTL in the text settings.

## Remove a font

1. Open the fonts panel.
2. Under **My Fonts**, hover the font and click the **trash** icon.
3. Confirm.

Before removing a font, change the text layers that use it to another font. Otherwise those layers will no longer display that font. You can also delete fonts with the API: [Delete fonts](https://templated.io/docs/fonts/delete/).

## Embedded editor

When the embedded editor is used with an `external-id`, fonts uploaded by an end user are associated with that user's session.

## Font licensing

Make sure your font license allows web and commercial use and embedding in generated images and PDFs. Templated does not check font licenses.

## Troubleshooting

- **Font not in the list:** search for its exact name. Uploaded fonts are named after the file name.
- **Bold or italic looks wrong:** upload the separate Bold or Italic file and select it on the layer.
- **Font works in the editor but not via API:** check that `font_family` matches the font name exactly.
- **Text shows boxes:** the font lacks the characters for that language. See "Non-Latin scripts".
- **Render looks different from the editor:** see "Why does my render look different from the editor?".

## FAQ

Q: How do I upload a custom font?
A: Select a text layer, click the font name in the toolbar, then click "Upload a font" at the bottom of the fonts panel. It is not in the Uploads tab.

Q: Can I use any Google Font?
A: Yes, on paid plans. Click "Add Google Font" in the fonts panel, then use it in the editor or via API by name.

Q: Is Arial available?
A: Not by default. Upload Arial or add Arimo, a free alternative with the same letter widths.

Q: My Hindi text shows as squares. Why?
A: The font does not support Devanagari. Add Noto Sans Devanagari and apply it to the layer.

Q: Can I upload a variable font?
A: We recommend uploading the static file for each weight instead of a variable font.

Q: How do I delete a font I uploaded?
A: In the fonts panel, under My Fonts, click the trash icon next to the font. Change layers that use it to another font first.

Q: Can I upload fonts on the Free plan?
A: No. Uploading fonts and adding Google Fonts require a paid plan.