Skip to content
+

MUI X

MUI X Charts

A collection of React chart components for data visualization.

Users

144k

Conversions

325k

Event count

200k

  • v6
  • v7
  • v8
JulOct2024AprJulOct2025Apr050K100K150K200K250K300K350K400K450K

@mui/material downloads on Jun 29, 25

  • v5
  • v6
  • v7

Issues opened daily

MTWTFSS

Issues opening time

MTWTFSS6am10am12am5pm8pm

Using MUI X Charts

Visualize your data with effortless elegance

High-performance and SVG-rendered customizable React charts with d3.js based data manipulation.

  • Windows
  • OS X
  • Linux
  • Chrome OS
  • Other
A chart for every data type

Effectively visualize your data from a wide variety of charts—bar, line, pie, scatter, and more.

Customization and styling

Fine-grained control over appearance to match your brand and style.

Data labeling

Deliver insights effectively through clear labels, interactive tooltips, and informative legends.

  • Bar
  • Line
  • min
  • max
  • Line
  • Pie
  • min
  • max
;;
  • Google
  • Meta
2024FebMarAprMay120140160180
Zoom and pan

Explore data with greater detail by zooming in and panning across the chart.

Composition

Build complex charts by composing individual building blocks.

<ChartDataProvider>
  <CustomLegend />
  <ChartSurface>
    <BarPlot />
    <ChartsXAxis />
  </ChartSurface>
</ChartDataProvider>
Advanced data visualization

Compare and analyze data across categories by layering data series.

Community and Pro

Two packages for every need

Start with the free-forever Community version, then upgrade to Pro when you are ready for additional features and components.

About licensing

Community

Free forever under MIT license. Includes essential charts and core features like axes, legends, styling customizations, tooltips, highlights, and more.

Pro

Requires a commercial license. Includes advanced charts and features like zoom and pan, chart export. Better suited for data rich and enterprise applications.

Essential Charts

Scatter Chart

Scatter Chart

Bar Chart

Line Chart

Donut Chart

Processor density (in transistor/mm²)

  • Other
  • Intel
  • Apple
  • AMD
1970198019902000201020202030110010k1M100M
More info

Advanced Charts

Radar

Radar

Compare elements on multiple metrics.

Heatmap

Highlight patterns on bidimensional data.

Funnel

Show pipeline performances.

Pokémon base stats

  • Bulbasaur
  • Charmander
  • Squirtle
HPAttackDefenseSpeedSpecial
More info

Advanced Features

Multi axes and series

Multi axes and series

Support multiple axes and chart types to pick the visualization that matches your need.

Zoom & Pan

Built-in zoom features to explore the details of your chart.

Export

Save your charts as PDF, PNG, or JPEG format to share them outside of the web.

Weather stats for Quebec city

JanMarMayJulSepNovMonth−20−100102030Temperature (°C)020406080100120Precipitation (mm)
More info

Supported Features

Features such as axes and legends are shared across Chart components and are described in their separate documents.

Axis

Custom components

Composition

Label

Legend

Stacking

Styling

Tooltips

Highlighting

Zoom and pan

Export

All MUI X Charts