+++
title = " Dashboard UI"
aliases = ["/docs/grafana/latest/features/dashboard/dashboards/"]
weight = 2
+++

# Working with Grafana dashboard UI

The dashboard UI has the following sections to allow you to customize the presentation of data.

<img src="/static/img/docs/v50/dashboard_annotated.png" class="no-shadow" width="700px">

- **Zoom out time range** (1)
- **Time picker dropdown** (2). Access relative time range options, auto refresh options and set custom absolute time ranges.
- **Manual refresh option** (3) Fetch new data.
- **Dashboard panel** (4) Click the panel title to edit panels.
- **Graph legend** (5) Change series colors, y-axis and series visibility directly from the legend.

For more details, see [Dashboard header]({{< relref "./dashboard-header.md" >}}) and [Dashboard rows]({{< relref "./dashboard-row.md" >}}).