Victory

Modular React charting components for building custom data visualizations.

← Back to All Libraries

Overview

Victory is a set of modular charting components for React and React Native from Formidable.

Victory emphasizes composition: combine axes, bars, lines, and tooltips as React components. That fits naturally into modern React apps and design systems.

Why Choose Victory?

  • Composable React-first API
  • Works across web and React Native
  • Animation and theming support
  • Good fit for component-driven product UIs

Real-World Applications

Common in React dashboards, design systems, and cross-platform apps that want charts expressed as components rather than imperative chart configs.

Example Charts

Live Victory demos (React via CDN) — bar, line, and pie.

Bar Chart

Line Chart

Pie Chart

Example Code

Minimal getting-started snippet for Victory.

// npm install victory
import { VictoryChart, VictoryBar, VictoryAxis } from "victory";

export function SalesBar() {
  return (
    <VictoryChart height={240} domainPadding={24}>
      <VictoryAxis />
      <VictoryAxis dependentAxis />
      <VictoryBar
        style={{ data: { fill: "#e8b84a" } }}
        data={[
          { x: "A", y: 28 },
          { x: "B", y: 55 },
          { x: "C", y: 43 },
          { x: "D", y: 72 },
        ]}
      />
    </VictoryChart>
  );
}