Assign fonts by component category

  • Release version: Australia
  • Updated March 12, 2026
  • 1 minute to read

    • Assign fonts to specific component categories to create a clearer visual hierarchy and ensure consistent typography across related UI elements.

    Before you begin

    Role required: ui_builder_admin

    For information on granular roles, see Granular admin roles.

    About this task

    Font assignments at the category level override broader defaults. Font size is managed separately in the Sizes tab and isn’t changed when assigning fonts by category. For information on editing font size, see Edit font size.

    Note:
    Changing the font at the category level does not affect individual components that have their own font settings.

    Procedure

    1. Navigate to All > Now Experience Framework > Theme 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
      Page drop-down list with Editor selected.
    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
      Example view of the Editor page.
    4. From the Global styles Overview panel, navigate to Typography and select the Fonts tab.

      Typography is split into Fonts and Sizes, with font assignments managed in the Fonts tab.

      Figure 3. Global styles Typography
      Typography with Fonts selected.
    5. Expand a component category.

      Each category displays its current font family, font face, and text transform settings.

    6. For the selected category, choose a font family.

      Select from available platform fonts or previously uploaded custom fonts. You can also Upload a custom font to your theme directly from the font selector.

    7. Select Save.
      Note:
      After you save changes to a typography option, a Remove override icon appears. Use Remove override to revert the option to its original default value.
    8. Optional: Adjust the font face or text transform for the category.
    9. Select Save.
    10. Use the available views to validate typography at different levels of detail.
      Switch between Abstract UI, Experiences, and Categories views to confirm that the category-wide font assignment is applied as expected across related components.

    Result

    Theme Builder automatically saves your theme record.

    If your theme is published, your font edits are visible to users who have your theme applied on refresh. For information on publishing your theme, see Publish your themes with Theme Builder.