---
sourceDocument: Zurich ServiceNow AI Platform user interface
sourceDocumentLink: https://www.servicenow.com/docs/r/zurich/platform-user-interface

 Release :

    - zurich

ft:locale :

    - en-US

ft:publication_title :

    - Zurich ServiceNow AI Platform user interface

ft:clusterId :

    - platux

bundleId :

    - platux

workflow :

    - Platform


---

# Upload custom font

# Upload a custom font to your theme {#ariaid-title1}

* Release version: Zurich
* 
* Updated July 31, 2025
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 2 minutes to read

Upload and preview up to 10 custom font families and an unlimited number of associated font faces in your Theme Builder theme.

## Before you begin

Role required: admin

## About this task

A font family is a grouping of fonts that share a common design and may include different font faces, like regular, bold, or italic. For example, Arial is a font family and within the Arial font family you may find font faces
such as Arial Regular, Arial Bold, and Arial Italic.

Upload only one font family at a time. Theme Builder does not support variable type fonts.  
Note:  
Only upload a font that you're licensed to use. Depending on their size, custom fonts can inadvertently adjust the amount of text on the page. Test and preview your fonts before publishing your theme to your instance.

## Procedure

1. Navigate to AllNow Experience FrameworkTheme Builder.  
   The Theme Builder landing page appears in the Home page view.
2. Use the Page drop-down list to select the Editor page view.  
   Figure 1. Page drop-down list
3. From the Theme drop-down list, select the theme that you want to edit.  
   The Global styles tab opens automatically with the Overview panel displayed.Figure 2. Editor page view
4. From the Overview panel, navigate to the Typography section and select Add custom font family.  
   Figure 3. Overview panel Typography section  
   Note:  
   You can also upload a font directly from the Typography panel.Figure 4. Typography tab  
   The Add custom font family modal appears.
5. Use one of the following options to upload your custom font family:
   * Select Browse, choose your custom font family file from your computer's file browser, and select Open.
   * Drag your custom font file from your computer's file browser and drop the file directly into the modal.

   {#upload-custom-font__choices_ubj_tfz_v2c}  
   Note:  
   The file must meet the following requirements to be saved.
   * Under 2 MB
   * WOFF, TTF, or ZIP format
   {#upload-custom-font__ul_vn4_yfm_rfc}
   Figure 5. Add custom font family modal with size and format limitations
6. **Optional:** Use the arrow within the modal to view any font faces you have uploaded with your custom font family.  
   Note:  
   Font faces can be applied individually to components, while the font family is applied globally.
   Figure 6. Add custom font family modal preview pane
7. Select Save.  
   Your new font family appears in the Typography section under Manage custom fonts, along with the associated font faces.Figure 7. Typography section with Custom font family listed
8. **Optional:** Preview how your selected font family or font face appears using any of the following options.
   * Use the UI styles preview or Experience preview tabs on the main stage to view how your new font appears globally throughout your theme.
   * Open the preview modal by selecting the custom font family or font face name that you want to preview listed beneath the Manage custom fonts header.
   {#upload-custom-font__choices_q1j_2rk_vfc}

## Result

After you upload your custom font, you can select it as your default font and apply it to your theme. For information, see [Edit your default font](https://www.servicenow.com/docs/sF6QijHLgntEfqeupjI4lw "Edit your default font family and choose from the predefined options in Theme Builder or your own custom fonts."). The most recently added font family appears at the bottom of the Manage custom fonts list.
* **[Add a font face](https://www.servicenow.com/docs/ilAVXEY0C7IeJZlHi4B9YQ)**   
  Add a new style such as bold or italic to your custom font family in Theme Builder.
* **[Delete a custom font from your theme](https://www.servicenow.com/docs/rkCTVEUGqsRnGTZKHG70BQ)**   
  Delete and remove a custom font family or font face you no longer need from your Theme Builder theme.

*[\>]: and then