> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hipocap.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Custom Dashboards

<Frame>
  <img src="https://mintcdn.com/hipocap/jGau1UNMEqA4k6Af/images/custom-dashboard/introduction.gif?s=4fa08232b01de87ece7b54b9553c9728" alt="Laminar Custom Dashboard Introduction" width="3022" height="1640" data-path="images/custom-dashboard/introduction.gif" />
</Frame>

## What You Can Track

Custom Dashboards are built on top of our powerful query engine, working across all your observability data - `traces`, `spans`, `events`, and `tags`. You can track any metric that matters to your application.

For detailed information on available entities, fields, and how to select the right data for your charts, see the [SQL Editor Reference](/sql-editor/reference).

## How to Build Charts

To create a chart, navigate to **dashboard** menu and click the **`+ Chart`** button in the upper right corner.

<Frame>
  <img src="https://mintcdn.com/hipocap/jGau1UNMEqA4k6Af/images/custom-dashboard/chart-builder-flow.gif?s=ac8153cfaad98f978f6fb1850d61f3e0" alt="Chart Builder flow" width="3016" height="1512" data-path="images/custom-dashboard/chart-builder-flow.gif" />
</Frame>

**The process:**

1. **Pick visualization**:
   * **Line Chart**: For time series visualization. We automatically prefill and group data by time range, perfect for tracking trends over time.
   * **Bar Chart**: Another alternative to visualize time series data, useful when you want to emphasize individual time periods.
   * **Horizontal Bar Chart**: For visualizations that need to be ranked, similar to a sortable table. Use this to compare and rank items (e.g., top users, models by cost).

2. **Select data source**: Traces, Spans, Events, and Tags

3. **Define metrics**: What to measure (count, sum, avg, min, max, p90, p95, p99)

4. **Add context**: Filters to narrow scope, grouping to break down by dimensions, order by fields, limits for top N results

5. **Save and customize**: Add to dashboard, resize as needed

## Examples

### Total Tokens by Model

See which models consume the most tokens to identify where your LLM costs are going. Use this to decide if you're using the right model for each use case.

<Frame>
  <img src="https://mintcdn.com/hipocap/jGau1UNMEqA4k6Af/images/custom-dashboard/total-tokens-by-model.png?fit=max&auto=format&n=jGau1UNMEqA4k6Af&q=85&s=f651ae75f5fa65b1fe30f622e76d2c98" alt="Total tokens by model chart" width="3016" height="1518" data-path="images/custom-dashboard/total-tokens-by-model.png" />
</Frame>

**How to build:**

* Chart type: Line Chart
* Table: `spans`
* Metric: `total_tokens` with `sum` aggregation
* Group by: `model`
* Filter: `span_type` = `LLM` (to include only LLM calls)

### p90 Cost by Provider

Track cost trends across different LLM providers over time. The p90 metric shows what most of your expensive requests cost, helping you compare provider pricing and spot cost increases.

<Frame>
  <img src="https://mintcdn.com/hipocap/jGau1UNMEqA4k6Af/images/custom-dashboard/p90-cost-by-provider.png?fit=max&auto=format&n=jGau1UNMEqA4k6Af&q=85&s=8049e44858318ff87d8ad7c0d37b89a2" alt="p90 cost by provider chart" width="3014" height="1514" data-path="images/custom-dashboard/p90-cost-by-provider.png" />
</Frame>

**How to build:**

* Chart type: Line Chart
* Table: `spans`
* Metric: `cost` with `p90` aggregation
* Group by: `provider`
