Preview components

  • Release version: Washingtondc
  • Updated February 1, 2024
  • 1 minute to read
  • As you are creating or managing your theme, you can preview the components available for inclusion on your instance.

    Before you begin

    Role required: admin

    About this task

    The components you can preview in Theme Builder were created in the Now Design System. For more information, see Next Experience Components on the ServiceNow Developer Portal.

    Procedure

    1. Navigate to All > Now Experience Framework > Themes > Theme Builder.
      The Theme Builder landing page displays in the Home page view.
    2. From the Home button, select the Editor page view.
      Figure 1. Editor page view
      Editor page view
    3. Select the Component styles tab.
      The component styles are graphically listed.
      Component styles
    4. You can scroll through the list to view all available components, or filter the list to view specific types of components.
      1. Select the Filter icon (Filter).
        Filter list
      2. Expand the categories of components you want to view and select the specific components within those categories you want to view.
        Note:
        For example, to view components for all primary buttons, expand the Button category and select the Primary, Primary positive, and Primary negative components. The list shows the components you selected.
        Filtering example
    5. To test how the components render using different background colors, select the Canvas color check box.
      Figure 2. Canvas color
      Canvas color
    6. Select the Background color you want to view and select Apply.
      New background color