---
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


---

# Manage or edit a theme

# Manage or edit a theme with Theme Builder {#ariaid-title1}

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

Customize and manage your theme and styling in a time and cost efficient way. After customizing, publish your new theme to either a web or mobile implementation of your instance.

## Before you begin

Role required: admin

## Procedure

1. Navigate to AllNow Experience FrameworkTheme Builder.  
   The Theme Builder landing page opens in a new tab and is displayed in the Home page view.Figure 1. Page menu
2. From the Home page view, select Manager page view to see all available themes.  
   From the Manager page view, you have the choice of viewing existing themes in two ways. You can choose the Grid view or the List view.  
   Note:  
   In both the Grid and List views, your published and unpublished themes are grouped separately. The published themes are themes that appear in the user's theme preference. View your web and mobile themes by selecting either the Web or Mobile button.
   Figure 2. Grid view Figure 3. List view  
   Use the More actions icon ![]()on a published theme to access these options:
   * Duplicate: creates a copy of the theme for reuse or modification.
   * Delete: permanently removes the theme from your list.
   * Add alternate color palette: applies a different color scheme to the theme for variation.
   * Unpublish: removes the theme from active use without deleting it, so you can edit or republish later.
   * Mark as default: sets the theme as the first option shown in the Next Experience Theme user preference. This option appears if the theme isn't the current default theme.
   {#tb-edit-theme__ul_mqf_bhk_xhc}  
   Use the More actions icon ![]()on a published theme with an alternate color palette defined to access these options:
   * Edit group name: renames the theme group, which includes the base theme and all its alternate color palettes.
   * Duplicate: creates a copy of the theme for reuse or modification.
   * Delete: permanently removes the theme from your list.
   * Unpublish: removes the theme from active use without deleting it, so you can edit or republish later.
   * Mark as default: sets the theme as the first option shown in the Next Experience Theme user preference. This option appears if the theme isn't the current default theme.
   {#tb-edit-theme__ul_kvs_qhk_xhc}  
   Use the More actions icon ![]()on an unpublished theme to access these options:
   * Duplicate: creates a copy of the theme for reuse or modification.
   * Delete: permanently removes the theme from your list.
   * Add alternate color palette: applies a different color scheme to the theme for variation.
   * Publish: makes the theme available for use.
   {#tb-edit-theme__ul_el5_fpf_p2c}
3. Choose the theme you want to edit using one of the following ways.

   | Page | Option |
   | Manager (Grid view) | From the Published or Unpublished section, choose the theme you want to edit and select Edit. |
   | Manager (List view) | From the Published or Unpublished section, choose the theme you want to edit and select the pencil icon ![](). |
   | Editor | Choose the theme you want to edit from the Theme drop-down list.Figure 4. Select a theme from the Theme drop-down list |
   |-|-|

   {#tb-edit-theme__choicetable_v1x_lnb_qfc}  
   Note:  
   When you select the theme you want to work on, verify that you selected the correct scope for the theme from the application scope picker.Figure 5. Application Scope Picker
4. Review and update the Global styles, as needed.  
   Figure 6. Global styles overview  
   Note:  
   The following style records are generated with your theme:
   * Your brand palette: Update the interface colors for your brand. For more information, see [Edit your theme colors](https://www.servicenow.com/docs/8cisyFqLtHEZEmY3BXOrMw "Edit and update your theme's core colors to create visual consistency and align with your brand.").
   * Logo: Update the logo. You can upload the logo during the theme application from the Overview page. For more information, see [Upload a new logo to your Theme Builder theme](https://www.servicenow.com/docs/J1_yE14eKW4jZnbciU6Sqg "If you previously applied a custom or default ServiceNow logo to your theme during theme creation, you can upload a new one in Theme Builder.").
   * Typography: Update the fonts applied globally to your experience. The fonts are used in headlines, titles, subtitles, body text, and captions. For more 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.").
   * Shape: Update the corner shapes of on-screen components. For more information, see [Edit corner shapes](https://www.servicenow.com/docs/P5I3vL47cbyi6loR9G9gZA "Edit and change the corner shapes applied globally to components such as buttons, modals, and drop-down menus throughout your Theme Builder theme.").
   {#tb-edit-theme__ul_kb5_l1d_dxb}
5. **Optional:** Preview your theme before publishing.
   1. Select the Experience preview tab from the Global styles panel.
   2. Select the experience that you want to preview from the Experience drop-down list.
   3. Select the Open in new tab icon ![]() to open the experience in a new tab.  
      Figure 7. Experience preview  
      An actual live instance appears with all the theme selections applied. You can preview it before implementing the selected themes on the actual instance.  
      Note:  
      For published themes, data in the Experience preview is live data. The changes that you make in the preview are reflected on your instance.
   {#tb-edit-theme__substeps_ylj_jqn_w2c}
6. Publish your theme.  
   For more information, see [Publish your themes with Theme Builder](https://www.servicenow.com/docs/xzvDf_xtMy9Pmu5IKCBx1A "Publish multiple themes to your web instance or a single theme to your mobile instance to reflect your company's brand.").
* **[Core styles, colors, variants, and alternate color palettes](https://www.servicenow.com/docs/Qp9qwyRW9btPnchVgodl0Q)**   
  You can tailor the look and feel of the Next Experience UI for different users by configuring the core styles, variants, and alternate color palettes.
* **[Add an alternate color palette](https://www.servicenow.com/docs/zdv4KKnQesnUqMFFlrqt_A)**   
  Customize a Theme Builder theme by creating an alternate color palette for the theme and publishing it to your instance.
* **[Working with Global styles](https://www.servicenow.com/docs/8JfeRlqrkMyeiCulQgZi~w)**   
  Global styles enable you to edit and define core design elements like fonts, colors, and shapes that apply across your entire theme.
* **[Working with Component styles](https://www.servicenow.com/docs/QxrzqJj01QyD_9Y~xXehSg)**   
  Component styles enable you to fine-tune the appearance of individual UI elements such as buttons, form controls, and navigation.
* **[Working with Image styles](https://www.servicenow.com/docs/woSgk5GFPTsqDl90SDrhlw)**   
  Image styles enable you to experiment with different color schemes for illustrations and replace default illustrations with your own custom images. The Image styles feature provides flexibility in customizing the visual elements of your theme.

*[\>]: and then


