App Builder
The App Builder is the visual editor you use to create and configure Data Apps. It provides a drag-and-drop interface for assembling pages, placing widgets, applying themes, and managing the lifecycle of your application through versioning.
Pages
Every Data App is composed of one or more pages. Each page acts as a distinct screen within your app, and you can navigate between pages using links, menus, or programmatic navigation.
- Add a page -- Click the + icon in the page panel to create a new page. You can name it, set its display order, and choose a layout.
- Reorder pages -- Drag pages in the page panel to change their sequence.
- Delete a page -- Remove a page you no longer need. Deleting a page also removes all widgets placed on it.
When you delete a page, all widgets on that page are permanently removed. This action cannot be undone in Draft mode, so verify your intent before confirming.
Widgets
Widgets are the building blocks of every page. Each widget connects to a data source and renders content in a specific format.
| Widget Type | Description |
|---|---|
| Chart | Renders visualizations using the Vega grammar. Supports bar, line, area, scatter, pie, and custom chart types. |
| Table | Displays tabular data with sorting, filtering, and pagination. |
| Text | Shows static or dynamic text, including markdown-formatted content. |
| Control | Provides interactive inputs such as dropdowns, sliders, and date pickers that filter data across the page. |
To add a widget, drag it from the widget palette onto the page canvas. Once placed, you configure its data source, visual properties, and any interactivity settings in the properties panel on the right.
Chart widgets use the Vega visualization grammar under the hood. This gives you access to a rich set of chart types and customization options. You can edit the Vega specification directly for advanced configurations.
Themes and Branding
The App Builder includes a theming system that lets you control the visual identity of your Data Apps through two configuration layers:
- AppStyle -- Controls layout-level settings such as spacing, border radii, font sizes, and widget padding.
- AppTheme -- Controls color palettes including primary and secondary brand colors, background colors, text colors, and accent colors.
To apply branding, open the Theme panel in the App Builder and set your organization's primary and secondary colors. These colors propagate automatically to all widgets, headers, and navigation elements across every page in the app.
Versioning
Data Apps follow a three-state versioning lifecycle:
| State | Description |
|---|---|
| Draft | The working version. You can edit pages, add widgets, and change themes freely. Draft versions are visible only to the app owner and collaborators with edit access. |
| Published | The live version that appears in the App Catalog. Publishing a draft creates a snapshot that all authorized users can launch. |
| Archived | A previously published version that has been retired. Archived versions are retained for historical reference but are no longer visible in the catalog. |
When you publish a Draft, the current Published version (if one exists) is automatically moved to the Archived state. This ensures that only one Published version is active at any time.
Because publishing creates a snapshot, you can continue editing the Draft without affecting the live Published version. Your users always see a stable app until you explicitly publish again.
Preview Mode
Before publishing, you can use Preview Mode to see exactly how your app will look and behave for end users. Preview Mode renders the app with live data and enforces the same layout, theming, and widget behavior that users will experience after publication.
To enter Preview Mode, click the Preview button in the App Builder toolbar. To return to editing, click Exit Preview.
Next Steps
- App Sharing -- Configure who can access your published Data App.
- App Catalog -- See how published apps appear in the catalog.