Overview
Frappe Charts is a simple, responsive, dependency-free JavaScript charting library.
Frappe Charts aims for simplicity: drop in a script, pass labels and values, and get clean SVG charts. It covers common chart types without the weight of larger visualization frameworks.
Why Choose Frappe Charts?
- Zero dependencies and easy CDN setup
- Clean defaults for product UIs
- Supports bar, line, pie, percentage, and heatmap charts
- Lightweight enough for admin panels and SaaS dashboards
Real-World Applications
Popular in ERP and business tools (including the Frappe ecosystem), internal dashboards, and apps that need attractive charts without a heavy visualization stack.
Example Charts
Live Frappe Charts demos — bar, line, and pie.
Bar Chart
Line Chart
Pie Chart
Example Code
Minimal getting-started snippet for Frappe Charts.
// npm install frappe-charts
import { Chart } from "frappe-charts";
import "frappe-charts/dist/frappe-charts.min.css";
new Chart("#chart", {
type: "bar",
height: 240,
data: {
labels: ["A", "B", "C", "D"],
datasets: [{ values: [28, 55, 43, 72] }],
},
colors: ["#e8b84a"],
});