> ## Documentation Index > Fetch the complete documentation index at: https://docs.molesignal.com/llms.txt > Use this file to discover all available pages before exploring further. # Build a dashboard > Create a dashboard, add panels with queries and visualizations, arrange them in rows, groups, and tabs, and set the dashboard defaults. Select **New dashboard** on **Dashboards**, or **Edit** on a dashboard, to open the editor. Creating a dashboard requires `dashboards.create`, and changing one requires `dashboards.edit`. A dashboard whose **Editable** setting is off, such as a built-in one, cannot be changed: create a copy instead. ## The editor | Control | Use | | - | - | | **Back to dashboard** | Leaves the editor. | | Dashboard title | Renames the dashboard in place. | | **Undo** / **Redo** | Steps back or forward through the changes since the editor opened. | | **Add** | Adds a **Panel**, **Text**, **Row**, **Group**, or **Tabs**. | | **Settings** | Opens the [dashboard settings](#dashboard-settings). | | **Save** | Saves the dashboard. Nothing is saved before. | Drag an element by its handle to move it, and drag its corner to resize it. Select an element to edit its position and structure in the side panel. New dashboards use a 24-column grid; change it under [Settings → General](#dashboard-settings). ## Elements | Element | Use | | - | - | | **Panel** | One or more queries drawn by a visualization. | | **Text** | Static Markdown or plain text, for notes, headings, and links. | | **Row** | A full-width header that holds the elements below it. A row can start **Collapsed initially**. | | **Group** | A box that keeps related elements together. | | **Tabs** | Several tabs, each with its own elements. Choose the tab that opens first. | ## Edit a panel Select **Edit** in the menu of a panel, or add a panel. The panel editor shows a **Live preview** of the panel with the current time range and variables, and two sets of tabs: | Tabs | Content | | - | - | | **Queries**, **Transformations**, **Data links** | What the panel reads, how the result is reshaped, and where a click leads. | | **Panel**, **Field**, **Overrides** | How the panel looks, how values are shown, and exceptions for some fields. | ### Queries Select **Add query** for each query of the panel. Each query has a **Ref ID**, such as `A`, a **Data source**, a **Language** of **PromQL** or **SQL**, and the **Expression**. The data source decides the default language and the other fields: | Data source | Default language | Other fields | | - | - | - | | **Metrics** | PromQL | | | **Logs**, **Traces**, **SQL** | SQL | **Stream name** and **Stream type** (**Logs**, **Metrics**, or **Traces**). | | **Profiles** | SQL | **Service** and **Profile type**, for example `cpu`. | **Legend** names the series with a template such as `{{service}}`. **Shared query** reuses a query of another panel, written `:`, so the data is read once. Queries can use [variables](https://docs.molesignal.com/en-US/dashboards/variables.md) such as `$service`. See [Querying](https://docs.molesignal.com/en-US/query) for SQL and PromQL. ### Transformations Transformations reshape the result before it is drawn. They run in order, and each can be disabled. | Transformation | Effect | | - | - | | **Filter fields**, **Organize fields**, **Rename fields** | Keep, order, hide, or rename fields. | | **Calculate field** | Add a field computed from others. | | **Reduce** | Reduce each series to values such as last, mean, max, or total. | | **Group by**, **Sort by**, **Limit** | Aggregate by a field, sort, and keep the first rows. | | **Join**, **Merge** | Combine the results of several queries. | | **Labels to fields**, **Rows to fields**, **Time series to table** | Turn labels, rows, or series into columns. | ### Panel options The **Panel** tab sets the **Title**, the **Description** shown on hover, the **Width** and **Height**, the **Visualization**, its options, and whether the panel is **Transparent**. | Visualization | Draws | | - | - | | **Time series** | Lines, bars, or points over time, with legend, tooltip, fill, and stacking options. | | **Bar chart** | Values compared by category. | | **Bar gauge** | Reduced values as horizontal or vertical bars. | | **Stat** | One value, such as the last, with an optional sparkline. | | **Gauge** | One value on a radial scale with threshold colors. | | **Table** | Rows, with paging. | | **Logs** | A compact log list with time and level. | | **Heatmap** | The intensity of values over time. | | **State timeline** | Changes of state over time. | | **Text** | Markdown. | **Repeat variable** draws one copy of the panel for each value of a variable, in a **Repeat direction** of **Horizontal**, **Vertical**, or **Grid**, up to **Max per row** copies in a row. See [Repeat panels](https://docs.molesignal.com/en-US/dashboards/variables.md#repeat-panels-by-a-variable). ### Field options The **Field** tab sets how values are shown: | Option | Use | | - | - | | **Unit**, **Decimals** | The unit, such as bytes, percent, or seconds, and the number of decimals. | | **Min**, **Max** | The ends of the scale. | | **Display name** | Replaces the name of the field. | | **Color scheme** | A fixed color, a palette, the threshold colors, or a continuous scale. | | **Thresholds** | Values where the color changes, in **Absolute** or **Percentage** mode, starting from **Base**. | | **Value mappings** | Show text, a color, or an icon for a value, a range, a regex match, or a special value such as null. | | **No-value text** | What the panel shows when there is no value. | **Overrides** apply other field options to some fields only. Select **Add override**, choose a matcher (**Field name**, **Field regex**, **Field type**, or **Query ref**), and **Add property** for each option to change. ### Data links A data link turns a click on a value into a jump. Select **Add data link**, enter a **Title**, and choose the target: **Logs**, **Metrics**, **Traces**, **Profiles**, another **Dashboard**, or an **External** URL. Choose whether the link carries the time range and the dashboard variables, and whether it opens in a new tab. The links appear in the menu of the panel. ## Dashboard settings **Settings** has four tabs. | Tab | Content | | - | - | | **General** | **Title**, **Description**, and **Tags**. The default time range (**From**, **To**) and **Timezone**. The **Grid**: **Columns** from 1 to 48, **Row height**, and **Gap**. **Refresh**: **Off**, **Interval** with a **Default interval**, or **Auto**. **Graph tooltip**: off, or a shared crosshair across panels. **Editable**. | | **Variables** | The variables of the dashboard. See [Variables](https://docs.molesignal.com/en-US/dashboards/variables.md). | | **Annotations** | Events drawn on time series panels. | | **Links** | Links in the head of the dashboard. | An annotation has a **Name**, a **Source**, a **Display** of **Line**, **Region**, or **Marker**, a **Color**, and **Enabled**. List its events under **Events** with **Add event**: a **Label**, a **Start timestamp (ms)**, and, for a region, an **End timestamp (ms)**. A link has a **Title**, a **Type** of **Dashboard** or **External**, a **URL**, and switches to carry the **Time range** and the **Variables** and to open in a **New tab**. ## Save and reuse Select **Save**. To reuse a panel, select **Copy** in its menu to copy its JSON, and paste it into another dashboard. To reuse a whole dashboard, **Export JSON** it and import it elsewhere. See [Import a dashboard](https://docs.molesignal.com/en-US/dashboards#import-a-dashboard). This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.