Multiline Chart

Time-series charts with a fixed top bar / plot / legend recipe and scrub tooltips.

Playground

Fixed recipe: top bar (title or menu + ranges/menu), plot with optional axes/grid, bottom legend. Scrub tooltip sits above the plot.

Base Rates

Dense multi-series line. Legend hide fades opacity; Y domain rescales the remaining series.

Connect rate

legend="values" shows Name: amount — series.value or latest datum.

Call outcomes

Area chart with both axes. Soft gradient fill under each line; strokes stay on top.

Per minute concurrency

Use MultilineChart for time-series metrics — rates, connect %, concurrency — when hover comparison across series matters.
Use BarList or BarFill for ranked categorical volume (top pages, agent leaderboard). Do not use MultilineChart for a single static ranking.
Gauge remains the circular 0–100 meter; do not replace it with a tiny line chart.

Fixed chrome: top bar (title or ghost menu + range tabs or menu) → plot → bottom legend. Do not invent alternate placements.
axes: none | x | y | both. showGrid toggles horizontal rules (default off). Y-axis side uses a left fade on the plot only — labels stay crisp.
legend: none | labels | values. Hide fades opacity (path stays); Y domain animates to visible series. All series may be hidden.
Hover panel is a custom floating surface above the plot (not DS Tooltip/HoverCard). Scrubber is instant and tethered to the tooltip.

Series labels should match product names or phone numbers users already know.
Format tooltip values like surrounding KPI copy (%, APY, counts). For legend values, pass series.value or rely on the latest datum.

Range and legend controls are buttons with pressed state on legend items.
Do not rely on color alone to distinguish series — labels stay in the legend and tooltip.