---
schema_version: "1"
id: ca7cbda4a8004eb8fa241421c32d1969b6b88c8446734654cd2690ffa0f7edf6
title: Adjust Dashboard and Widget Formatting
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/analytics/264-0-0/tua_create_dashboard_format.md
canonical_url: https://help.salesforce.com/s/articleView?id=analytics.tua_create_dashboard_format.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 0f2a026e8ff1afbf9ff1c681d2f70229a663b34fc7bf50b312713f66e9d91e79
description: Format the dashboard and its widgets to create a consistent user experience.
products:
  - Tableau Next
release: "264"
---
# Adjust Dashboard and Widget Formatting

Format the dashboard and its widgets to create a consistent user experience.

### Required Editions

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small edition"><colgroup><col></colgroup><tbody><tr class=""><td class="slds-cell-wrap" style="vertical-align:top;"><a href="https://help.salesforce.com/s/articleView?id=analytics.tua_editions.htm&amp;language=en_US" target="_blank">View supported editions.</a></td></tr></tbody></table>

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small permission">
      <colgroup>
        <col>
        <col>
      </colgroup>
      <thead class="slds-text-title_caps ">
        <tr class="">
          <th scope="colgroup" class="slds-cell-wrap" colspan="2" style="text-align:center;vertical-align:top;" id="d49473e52">User Permissions Needed</th>
        </tr>
      </thead>
      <tbody>
        <tr class="">
          <td data-label="User Permissions Needed" class="slds-cell-wrap" style="vertical-align:top;" headers="d49473e52 ">To edit Tableau Next dashboards:</td>

          <td class="slds-cell-wrap" style="vertical-align:top;" headers="d49473e52 "><span>Tableau Unmetered Platform Analyst or Tableau Next Platform Analyst</span> permission set</td>

        </tr>
      </tbody>
    </table>

## Format a Dashboard

To format the dashboard, click Dashboard Properties ![List widget](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-analytics-tua-264-0-0-production-enus/d794334f-d174-49d3-a4d2-a615bd2e54aa/tua/images/tua_create_dashboard_format.png) to open the properties panel.

## Grid Preset

Grid Preset makes dashboard design easier by providing a structured framework that assists with the arrangement of dashboard widgets. Use the available layout patterns to help you achieve a professional appearance while reducing manual adjustments. Layout patterns include:

- **Standard** is a commonly used, well-structured layout that ensures uniformity across different dashboards.
- **Fine** organizes information in a smaller space, making it easier to find information.
- **Spacious** helps make dashboards more visually appealing by providing generous spacing between dashboard widgets.
- **Custom** offers more flexibility, enabling you to choose how data is presented and arranged.

## Additional Layout Properties

The table below provides details on the remaining dashboard properties for fine-tuning the dashboard, ensuring it aligns with user preferences and corporate standards.

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <thead class="slds-text-title_caps ">
          <tr><th class="slds-cell-wrap" scope="col" id="d49473e132">
            <p>Property</p>
          </th>
          <th class="slds-cell-wrap" scope="col" id="d49473e138">
            <p>Description</p>
          </th>
        </tr></thead>
        <tbody><tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">Search</td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">Locates a dashboard asset.</td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Maximum Dashboard Width</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets the largest width that a dashboard can have.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Minimum Dashboard Width</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets the smallest width before a horizontal scroll bar appears.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Dashboard Preview Width</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Previews the dashboard at preset widths so you can check how it looks on narrower
              screens.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Grid Background Color </p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets the background color of the dashboard grid.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Gutter Color</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets the color between widgets in a dashboard.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Widget Background Color </p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets a widget's background color.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Widget Border Color </p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets the border color around a widget.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Border</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Adds an outline that surrounds dashboard assets.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Border Width</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets the thickness of the border around dashboard assets.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Border Radius </p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Sets how much curve is applied to the corners of dashboard assets.</p>
          </td>
        </tr>
        <tr class="">
          <td class="slds-cell-wrap" data-label="Property" headers="d49473e132">
            <p>Apply to all widgets</p>
          </td>
          <td class="slds-cell-wrap" data-label="Description" headers="d49473e138">
            <p>Applies format settings to widgets.</p>
          </td>
        </tr>
      </tbody></table>

## Control How Widgets Appear on Narrow Screens

To keep the dashboard layout intact when screen space is limited, enter a value in the **Minimum Dashboard Width** field on the Style tab. When the screen is narrower than that width, a horizontal scroll bar appears.

To check the layout at common widths, click **Dashboard Preview Width** and select a preset.

To keep long text contained, select a text widget and use the **Overflow** and **Text Wrapping** menus.

Page links in a navigation widget automatically move into an overflow menu when they don’t fit. To show navigation as a compact list, change the navigation widget display to a dropdown menu.

## Organize Dashboard Widgets

Use Reflow to automatically shift and reposition widgets without manual reorganization. To disable Reflow, select **Disable Reflow** from the dropdown menu.

![Enabling Reflow.](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-analytics-tua-264-0-0-production-enus/d794334f-d174-49d3-a4d2-a615bd2e54aa/tua/images/tua_create_dashboard_format_4.png)

Move a widget to the desired location. Surrounding widgets automatically adjust their position to accommodate the new placement.

![Moving a visualization widget to the left of another widget.](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-analytics-tua-264-0-0-production-enus/d794334f-d174-49d3-a4d2-a615bd2e54aa/tua/images/tua_create_dashboard_format_5.png)

## Format a Widget

To adjust content and appearance in widgets, use the Widget and the Design tabs in the properties panel. For example, go to the Design tab to customize widget colors that highlight data progress and status or to apply brand colors.

![Note](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-analytics-tua-264-0-0-production-enus/d794334f-d174-49d3-a4d2-a615bd2e54aa/images/icon_note.png)

Note Color changes applied to visualization widgets are specific to that dashboard and don’t alter the color settings defined in the Visualization Builder.

![Default color options for the text widget's label color.](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-analytics-tua-264-0-0-production-enus/d794334f-d174-49d3-a4d2-a615bd2e54aa/tua/images/tua_create_dashboard_format_3.png)

Go to the Widget tab and find Card Setup to select metric widget content.

![Card Setup options](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-analytics-tua-264-0-0-production-enus/d794334f-d174-49d3-a4d2-a615bd2e54aa/tua/images/tua_create_dashboard_format_2.png)