Skip to main content

Layout & Grid

Every dashboard uses a responsive grid to arrange its reports into tiles. The grid gives you control over how reports are sized and positioned, so you can create layouts that group related data together and guide the viewer's eye from high-level metrics to detailed breakdowns.

Grid System​

The grid divides the available width into 12 columns. Each tile occupies a number of these columns, determining how much horizontal space it takes. For example, a tile spanning 6 columns takes half the dashboard width, while a tile spanning 12 columns takes the full width.

Tile height is adjustable in increments of 40 pixels. The dashboard scrolls vertically if the content exceeds the browser window height.

Overview Overview

Dashboards always use the full width of the browser window. On narrow screens, a responsive mode automatically switches to a single-column layout.

Editing the Layout​

To rearrange or resize tiles, select Edit Layout from the dashboard dropdown menu.

image-300 image-300

In layout mode:

  • Drag anywhere on a tile to move it to a new position.
  • Drag the bottom-right corner handle to resize a tile.
  • Click Save Layout when done, or Cancel to discard changes.

Overview Overview

When you create a new report (via New Report or Duplicate), layout mode opens automatically with the new report highlighted so you can position it right away.

Overview Overview

Floating Mode​

By default, tiles automatically compact upward to fill empty space — for example, when a report above is deleted. Floating mode disables this behavior, letting you position tiles freely with gaps between them.

Toggle floating mode in the layout editor.

Overview Overview

Responsive Behavior​

On mobile devices or narrow browser windows, the dashboard switches to a single-column layout where all tiles stack vertically. This ensures each report gets enough width to be readable.

image-300 image-300

tip

The breakpoint at which the dashboard switches to single-column mode can be fine-tuned for sharing links and embeds via URL parameters.

TV Mode​

TV Mode is an option for sharing links, best suited for dashboards shown on a wall-mounted TV or other full-screen display.

By default, a shared dashboard's reports are rendered at the heights set in the layout — which can leave empty space below the last row, or crop the last row when the layout is taller than the screen. TV Mode instead dynamically adjusts the height of each report so the reports stretch to fill the whole height of the screen, making the dashboard fit the display's aspect ratio with no wasted space.

Enable it by adding the tvMode URL parameter to the link, or use the TV Mode toggle in the sharing link preview to check how the link looks before sharing.