---
title: Workspace Builder components for home pages
description: Several UI Builder components are available as elements to build home pages and contextual side panels in Workspace Builder. Workspace Builder helps you quickly create workspaces.
locale: en-US
canonical_url: https://www.servicenow.com/docs/r/australia/application-development/workspace-builder/workspace-builder-components-ref.html
release: australia
product: Workspace Builder
classification: workspace-builder
topic_type: reference
last_updated: "2026-03-12"
reading_time_minutes: 2
breadcrumb: [Reference, Workspace Builder, Builder library, Developing your application, Building applications]
---

# Workspace Builder components for home pages

Several UI Builder components are available as elements to build home pages and contextual side panels in Workspace Builder. Workspace Builder helps you quickly create workspaces.

For complete details on all elements and components, see the [ServiceNow® Developer site](https://developer.servicenow.com/dev.do#!/reference/next-experience/components?availability[]=Draft&availability[]=In+Progress&availability[]=Available&categories[]=Dev-Design+System&releases[]=utah&query=&order_by=nameAsc&limit=120&offset=0&categories[]=uib_component&categories[]=uib_macroponent-component&categories[]=uib_facades).

## Data visualization components

The data visualization component is a container for available chart types for use in Workspace Builder home pages. Select the chart type to display data in different ways depending on your application. You can create a new data visualization or repurpose an existing data visualization by choosing it in the Select visualization from library modal and selecting **Add to dashboard**.

For more information on data visualization components, see the following topics and sources:

-   [Data visualizations in Platform Analytics](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/now-intelligence/analytics-center-data-visualizations.md)
-   [Create a single score data visualization](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/now-intelligence/create-dv-sing-sc-ac.md)
-   [Developer site data visualization component listing](https://developer.servicenow.com/dev.do#!/reference/now-experience/yokohama/now-components/sn-par-visualization-base/overview)

\[Omitted image "wb-data-viz-purple-new.png"\] Alt text: Data visualization element to be edited

## Filter components

Filters enable you to filter data visualizations without modifying the visualizations. Add a filter element when working with the home page in the canvas. Then select a table, field, and other properties to configure the filter. When a user selects one or more values of the field, the filter applies to those data visualizations that are based on the same data source.

For more information on using filters components to build a workspace, see the following topics and sources:

-   [Next Experience filters](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/now-intelligence/interactive-filters-workspace.md)
-   [Developer site filter component listing](https://developer.servicenow.com/dev.do#!/reference/now-experience/yokohama/now-components/sn-component-filter/overview)

## Heading components

Heading components are available in the home pages for workspaces. Add a title to your landing page using a heading component.

The following image shows a "My Heading" heading.

\[Omitted image "heading-component-purple.png"\] Alt text: Example heading component

For more information on heading components, see the [Heading Overview on the Developer site](https://developer.servicenow.com/dev.do#!/reference/now-experience/yokohama/now-components/now-heading/overview).

## Image components

Add images to your landing page with an image component.

When you drag the image component icon \(\[Omitted image "icon-image-component.jpg"\] Alt text: Image component\) into the preview pane, a stock image appears that you can change and resize. You can change the stock image by supplying your image's URL.

\[Omitted image "component-image-purple.png"\] Alt text: Sample image component

For more information on image components, see the [Developer site image component listing](https://developer.servicenow.com/dev.do#!/reference/next-experience/yokohama/now-components/now-image/overview).

## List components

Use a list component to add lists to your landing page.

When you drag the list component icon \(\[Omitted image "icon-list-component.jpg"\] Alt text: List component\) into the preview pane, a sample list appears.

\[Omitted image "wb-list-component-purple.png"\] Alt text: Sample list component

For more information on list components, see the [Developer site List component reference](https://developer.servicenow.com/dev.do#!/reference/next-experience/yokohama/now-components/now-record-list-connected/overview).

## Rich text components

Add text to your landing page with a rich text component to explain parts of your landing page, for example, "Tackle these priority 1 incidents first."

\[Omitted image "wb-rich-text-component-purple.png"\] Alt text: Sample rich text component

For more information on rich text components, see the [Developer site Rich text component reference](https://developer.servicenow.com/dev.do#!/reference/next-experience/yokohama/now-components/now-rich-text/overview).

**Parent Topic:**[Workspace Builder reference](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/workspace-builder/workspace-builder-reference.md)