@vireya/ui · charts

Charts Showcase

Recharts wrapped with Vireya tokens — copy any variant, swap the dataset, ship.

41 charts12 families0 runtime CSS

Vireya's charts wrap recharts in the same design-token system as the rest of the library: swap the dataset, and every series, axis and tooltip recolours from your active theme — no runtime CSS. From areas and bars to candlesticks, heatmaps, Sankey and funnel diagrams, the families below cover the charts real dashboards need.

Each family opens to live, themeable examples with copyable source and a guide on when to reach for that chart type — and when not to. Learn how the colours come from design tokens.

area/*

Area

Area charts — emphasize cumulative magnitude and trend direction.

4 variants

bar/*

Bar

Bar charts — compare discrete categories, vertical or horizontal.

6 variants

line/*

Line

Line charts — trend over time, single or multi-series.

4 variants

pie/*

Pie

Pie & donut — share-of-whole, small number of slices.

2 variants

radial/*

Radial

Radial bar charts — gauge-like, progress, ranked metrics.

2 variants

heatmap/*

Heatmap

Heatmaps — density / activity over a 2D grid. Composed from SVG primitives wrapped in ChartContainer (recharts has no native heatmap).

2 variants

scatter/*

Scatter

Scatter / bubble plots — relationship between two numeric variables, with optional ZAxis to encode a third as point size.

4 variants

force/*

Force

Diverging / force-stacked bars — Likert composition around a central baseline.

2 variants

stock/*

Stock

Time-series price charts with annotations — earnings windows, MAs, milestone dots.

12 variants

treemap/*

Treemap

Hierarchical area-encoded breakdowns — portfolio / sector / market-cap composition.

1 variant

sankey/*

Sankey

Flow diagrams — fund flows, capital allocation, source → bucket → destination.

1 variant

funnel/*

Funnel

Conversion funnels — visitor → signup → activation → retention drop-off visualization.

1 variant