Ripl

Appearance

RiplOne API. Any Context.

A unified, zero-dependency TypeScript library for drawing and animating 2D graphics, charts, and data visualizations across Canvas, SVG, Terminal, and WebGPU.

Get Started
Charts
3D
Demos

One familiar API

Draw to any context through a single, DOM-like API. Ripl mirrors the DOM and CSSOM — hierarchy, property inheritance, events, styling, and CSS-like querying — so switching between Canvas and SVG is a one-line change.

Charts & data visualization

23 ready-made, animated chart types — bar, line, area, pie, scatter, candlestick (OHLC), heatmap, radar, sankey, treemap and more — with axes, legends, tooltips, and crosshairs built in.

Modular & tree-shakable

Zero runtime dependencies and fully tree-shakable. Ship only the shapes, scales, and contexts you use across Canvas, SVG, Terminal, and experimental WebGPU 3D.

High performance

Hoisted scene buffers, O(n) rendering, virtual-DOM diffing for SVG, and a cancellable animation engine keep interactive visualizations smooth at scale.

Draw once, render anywhere ​

Ripl (pronounced "ripple") is a high-performance, zero-dependency graphics library for the web. It gives developers a single, unified API for 2D rendering and interactive data visualization — and renders the exact same scene to Canvas, SVG, or even the Terminal (as braille/ANSI), with experimental WebGPU 3D. Build custom shapes, charts, and animations once, then choose the rendering context that fits your use case — no rewrites required.