Live Examples

View all chart types with automatic shadcn theming in action.

Open Interactive Playground →

Chart Types Included

The playground demonstrates the following chart types, all automatically themed with your shadcn CSS variables:

Line Charts

Basic Line Chart - Smooth curves with tooltips
Multi-Series Area Chart - Stacked areas with legend

Bar Charts

Grouped Bar Chart - Side-by-side comparisons
Horizontal Bar Chart - For categorical data
Stacked Bar Chart - Cumulative values
Mixed Bar & Line - Dual-axis visualizations

Pie Charts

Basic Pie Chart - Simple distribution view
Donut Chart - With center emphasis

Analytical Charts

Scatter Plot - Correlation analysis
Radar Chart - Multi-dimensional comparisons
Gauge Chart - KPI indicators
Funnel Chart - Conversion funnels

Financial Charts

Candlestick Chart - Stock price visualization

Hierarchical Charts

Treemap - Nested rectangles
Sunburst Chart - Radial hierarchy

Polar Charts

Polar Bar Chart - Circular bar representation

Component States

The playground also demonstrates:

Loading State - Built-in loading indicator
Empty State - Graceful empty data handling
Skeleton - Loading placeholder

Dark Mode

Toggle between light and dark mode to see automatic theme adaptation. All charts re-theme instantly when you switch modes.