---
title: Extend your UI experience with viewport components
description: Viewports are specialized components that enable you to extend your experience without needing to own the parent page in UI Builder. You can work with viewports in three ways. You can add a viewport component or a viewport-enabled tab to a page, or add a viewport to the Contextual sidebar component.
locale: en-US
canonical_url: https://www.servicenow.com/docs/r/australia/application-development/ui-builder/viewports-overview.html
release: australia
product: UI Builder
classification: ui-builder
topic_type: concept
last_updated: "2026-03-12"
reading_time_minutes: 2
breadcrumb: [Customize UI Builder pages using components, Working in UI Builder, UI Builder, Builder library, Developing your application, Building applications]
---

# Extend your UI experience with viewport components

Viewports are specialized components that enable you to extend your experience without needing to own the parent page in UI Builder. You can work with viewports in three ways. You can add a viewport component or a viewport-enabled tab to a page, or add a viewport to the Contextual sidebar component.

Add a viewport component to your page to create separate content even if you do not own the content of the page itself. Create subpages, specify audiences, or customize content with different data, routes, and screens. For more information about viewport components, see [Add a viewport component to your page](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/work-with-viewport-components.md).

You can replace Tabs components with Viewport-enabled tabs as a way to display third-party custom data, assign audiences, and create variants. For more information about viewport-enabled tabs, see [Replace a tab with a viewport-enabled tab](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/convert-a-tab-to-a-viewport-tab.md).

Use the **Edit content** mode of UI Builder to add viewports or tab sets to a page or Contextual sidebar component. Edit tabs in a Contextual sidebar component as you would on a page using the **Config** panel. The main difference is, when you are in the **Edit content** mode of a tab, the page management area changes to **Tab management**.

Select the menu icon \[Omitted image "UIB-menu-icon.png"\] Alt text: Menu icon to edit your tab settings, or change the required or optional parameters.

Add viewport modals to your experience to embed subpages or other experiences within a modal in your parent page/experience. For more information about adding viewport modals to your experience, see [Add a viewport modal to your experience](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/add-viewport-modal.md).

-   **[Add a viewport component to your page](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/work-with-viewport-components.md)**  
Add a viewport component to your page and create a subpage to create separate content on the page.
-   **[Add a viewport modal to your experience](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/add-viewport-modal.md)**  
Add a viewport within a modal in your experience.
-   **[Replace a tab with a viewport-enabled tab](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/convert-a-tab-to-a-viewport-tab.md)**  
Convert a tab on a page to a viewport-enabled tab. Use viewport-enabled tabs to display third-party custom data, assign audiences, and create variants.

**Parent Topic:**[Customize UI Builder pages using components](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/work-components.md)