📊 Minimal Charts — beautiful charts for web and native mobile
📊 Get access to stunning chart types that work perfectly on both web and native mobile. Easy to install and configure, with full flexibility to customize them to match your brand. Every chart has an elegant, minimalist design that fits any kind of application.

One plugin. Web and native mobile. Zero dependencies.

────────────────────────────────
TRY IT
────────────────────────────────

DEMO: https://plugins-testing-46093.bubbleapps.io/version-test

EDITOR: https://bubble.io/page?id=plugins-testing-46093&tab=Design&name=index

────────────────────

✨ What makes it different

🎨 Every colour is a field, not a palette you pick from. Background, axis labels, values, title, subtitle, legend, grid, axis line and the four parts of the tooltip. Plus one colour per series, or per slice in a pie. Match your brand to the hex, or leave the fields empty and take the defaults.

🌗 Dark mode with nothing to switch on. Give a chart a dark background and the labels, the grid and the tooltip recalculate themselves to stay readable. Leave the background transparent and the chart reads the colour actually behind it on your page, so one dropped on a dark card just works. These are not the same colours on a darker background: they are a separate set of tones.


⚡ Zero dependencies. None. No Chart.js, no D3, no CDN, no external script of any kind. Every chart is drawn as SVG by code that ships inside the plugin. Your page doesn't get heavier, your users' numbers never leave your app, and nothing breaks because someone else's server went down.

📱 Every chart type works on web and on native mobile. Same fields, same names, same look. Build the dashboard once and it reads the same on a laptop and on a phone.

🖱️ Interactive without configuring anything. Tooltip on hover or touch, a crosshair that snaps to the nearest point, and a legend you can click to hide a series and click again to bring it back.

────────────────────

🎛️ Everything you can control

Data

• Up to 6 series per chart, from any Bubble data source
  
• Works inside repeating groups, popups and floating groups
  
• Type values in by hand for a demo, or bind them to a search for the real thing
  
• Advanced: pass the whole dataset as JSON if you would rather build it yourself
  

Colour

• One field per series (or per slice): s1_color … s6_color
  
• Background, axis labels, printed values, title, subtitle, legend, grid, axis line
  
• Tooltip background, heading, values and border
  
• Every one optional. Fill in the two you care about and leave the rest alone
  

Layout

• Title and subtitle, legend above or below, custom font, custom padding
  
• Value labels: none, last point only, highest and lowest, or every one
  
• Fixed size or fill the container. On mobile, a height field so a chart can never collapse to nothing
  

Numbers

• Prefix and suffix: $1,250 · 85%
  
• Compact mode: 12.5K instead of 12,500, with the exact figure still in the tooltip
  
• Decimal places, thousands separator, fixed Y-axis minimum and maximum
  

Per chart type

• Bars: thickness, corner radius, gap between groups, horizontal mode, which series becomes a line in a Combo
  
• Pie and Donut: hole size, gap between slices, sorting, and small slices rolled into "Other" automatically
  
• Gauge and Progress: any range you want, with your own centre label and value
  
• Line and Area: line width, visible points, fill opacity, curve style
  
• KPI: sparkline below the number or beside it, and a note saying what the change is measured against
  
• Advanced: bubble size range, radar fill and grid shape, heatmap cell size and colour scale, waterfall step colours
  

────────────────────

🔔 Built for interaction

Every chart publishes what the user just touched, so you can build a drill-down without writing JavaScript.

States: clicked_label, clicked_value, clicked_series, clicked_index, and the same four for hover.
Events: clicked, hovered, loaded.

A typical use: When Chart's clicked → Display list in RepeatingGroup → Search for Orders where month = Chart's clicked_label.

────────────────────

⚡ Set up in 3 steps

1. Drag the element onto your page or your mobile screen
2. Connect two lists: your labels and your numbers
3. Pick a chart type, and your colours if you want your own

────────────────────

💬 Support and updates

Questions, bug reports and feature requests are welcome

Make your dashboards look like the product you wish you'd built. 📊