Bar Chart

Chart.ts bar charts render as real SVG DOM elements. Vertical, horizontal, stacked, and grouped layouts. Style every bar, axis, and label with Tailwind CSS classes. WCAG AA accessible with keyboard navigation and screen reader support.

$npm install @chartts/core
example.tsx
import { bar } from "@chartts/core"

const svg = bar({
  data: [
    { category: "Q1", revenue: 42000 },
    { category: "Q2", revenue: 58000 },
    { category: "Q3", revenue: 71000 },
    { category: "Q4", revenue: 93000 },
  ],
  x: "category",
  y: "revenue",
  layout: "vertical",
})

Features

Vertical, horizontal, stacked, and grouped layouts
SVG rendering for CSS styling
Tailwind className on bars, axes, labels, grid
Animated transitions between data states
Responsive with automatic label rotation
WCAG AA compliant with keyboard navigation
Under 3kb tree-shaken
Read the DocsSee DemosExamples