Search blocks

Find a block by name or category

18 Blocks

Charts Blocks

Chart blocks built on shadcn/ui's chart component and Recharts: area, bar, line, donut, radar, radial, and funnel charts in analytics-card form, with range toggles that re-animate the series, hover crosshairs, count-up headers, and a live ticking API-traffic monitor. Copy a finished analytics card, not a bare chart primitive.

Charts 1

Free

Bar chart card of monthly revenue with a value label above each bar and a fiscal year select that swaps the whole dataset.

CardChartSelect
recharts

Charts 2

Free

Gradient area chart of monthly active users, topped by a three KPI row (total, peak month, peak users) and a year over year growth badge.

BadgeCardChart
recharts

Charts 3

Free

Stacked area chart of visitors and signups with a legend, hover tooltip, and a 7d, 30d, or 90d range select that swaps the dataset.

BadgeCardChartSelect
recharts

Charts 4

Free

Line chart card plotting unique visitors month by month, with a grid, labelled axes, and a hover tooltip on each point.

CardChart
recharts

Charts 5

Free

Donut chart splitting traffic by source, with a centered visitor total and a ranked, color coded legend list underneath.

CardChart
recharts

Charts 6

Pro

Net revenue area chart with a count-up total, a Week, Month, or Year toggle that blur swaps the series, a hover crosshair, and peak and low markers.

CardChartToggle Group
motionrecharts

Charts 7

Pro

Row of four KPI tiles (recurring revenue, active users, conversion, retention), each with a count-up figure, trend badge, and sparkline that re-animates on range change.

BadgeCardChartSeparatorToggle Group
motionrecharts

Charts 8

Pro

Grid of four metric cards pairing a count-up figure and trend badge with a gradient area sparkline, an exact hover tooltip, and a lift on hover.

BadgeCardChart
motionrecharts

Charts 9

Pro

Donut chart of revenue by acquisition channel with a count-up center total; hovering a legend row highlights its arc and dims the rest.

CardChart
motionrecharts

Charts 10

Pro

Single proportional horizontal meter of recurring revenue by account that fills segment by segment, above a ranked account list with brand logos.

CardChartSeparator
motionrecharts

Charts 11

Pro

Grouped bar chart comparing this quarter against last by region, with a count-up total, delta badge, legend, and hover that dims the other regions.

BadgeCardChart
motionrecharts

Charts 12

Pro

Stacked bar chart splitting monthly revenue into new, expansion, and reactivation, with a legend, per segment tooltip, count-up total, and growth badge.

BadgeCardChart
motionrecharts

Charts 13

Pro

Conversion funnel chart with count-up stage tiles above a four layer stacked area of visits, product views, add to cart, and checkout.

CardChart
motionrecharts

Charts 14

Pro

Dual line chart of orders against expenses with a toggle that blur swaps the emphasized series, beside a side rail of count-up KPI tiles.

CardChartToggle Group
motionrecharts

Charts 15

Pro

Radar chart comparing a sales team against a benchmark across six pipeline stages, with a quarter select that re-animates the polygon and legend.

CardChartSelect
motionrecharts

Charts 16

Pro

Concentric radial rings tracking revenue, activation, and retention goals around a count-up average, with tiles that emphasize a ring on hover.

CardChart
motionrecharts

Charts 17

Pro

Composed chart layering faint monthly sales bars under an orders line, with a count-up total, fiscal year select, hover crosshair, and channel breakdown.

CardChartSelectSeparator
motionrecharts

Charts 18

Pro

Real-time area chart of requests per second that appends a point on every tick, with a pulsing live dot and peak, average, and error rate stats.

CardChartSeparator
motionrecharts

Charts Blocks FAQ

Charts blocks also appear in the free page templates above: full pages you can install with one command.