Candlestick Chart

Professional candlestick charts for financial applications. OHLC data support, volume bars, moving average overlays, and real-time updates. Renders as SVG with full Tailwind CSS styling.

$npm install @chartts/react
example.tsx
import { CandlestickChart } from "@chartts/react"

<CandlestickChart
  data={ohlcData}
  x="date"
  open="open"
  high="high"
  low="low"
  close="close"
  className="h-96"
  upClassName="fill-emerald-500"
  downClassName="fill-red-500"
/>

Features

OHLC (Open, High, Low, Close) data format
Volume bars overlay
Moving average lines
Customizable up/down colors
Zoom and pan for time series
Real-time data updates
SVG rendering with Tailwind styling
Read the DocsSee DemosExamples