# Baseline chart — Detent

> A metric against any day you choose. Click the line and that day becomes the level: above it prints blue, below it red, and the sentence reads again from there.

Canonical: https://detentui.com/components/chart
Last updated: 2026-11-10

## About

A metric against any day you choose. Click the line and that day becomes the level: above it prints blue, below it red, and the sentence reads again from there.

## Details

- The headline is a sentence, “Since Sep 6, up $18,000 by Oct 8, or 42.7%”, so the answer comes before the chart.
- Click any day and the level glides there. Gain prints in blue grain and loss in red, against the day you chose.
- Point along the line and the sentence reads to that day instead of the latest.
- Set `look="plain"` for flat fills where the grain is too much.

## Keyboard shortcuts

| Keys | Action |
| --- | --- |
| ← / → | Read the day before or after |
| Home / End | First or latest day |
| ↵ | Start from this day |
| Esc | Let go |

## Install

```bash
npx shadcn add https://detentui.com/r/chart
```

## Related
- [All components](https://detentui.com/components)
- [Pro](https://detentui.com/pro)