Getting started
Overview
What silverpoint is
The first ground reproduces the mechanics of Renaissance silverpoint: a prepared middle-tone substrate, a fine silver line, tonal value built from hatch density, and white heightening reserved for the live value. The second, cyanotype, prints a white line on Prussian blue whose tone is its weight.
Unlike every other hand-drawn charting library, the irregularity lives only in the ornament: the geometry of the data is exact, and every chart offers a precision mode with the inking switched off entirely.
| hour | hits | baseline |
|---|---|---|
| 00 | 18 | 22 |
| 02 | 14 | 18 |
| 04 | 11 | 15 |
| 06 | 16 | 17 |
| 08 | 34 | 30 |
| 10 | 58 | 48 |
| 12 | 71 | 60 |
| 14 | 66 | 62 |
| 16 | 74 | 64 |
| 18 | 88 | 70 |
| 20 | 62 | 55 |
| 22 | 41 | 40 |
| hour | hits | baseline |
|---|---|---|
| 00 | 18 | 22 |
| 02 | 14 | 18 |
| 04 | 11 | 15 |
| 06 | 16 | 17 |
| 08 | 34 | 30 |
| 10 | 58 | 48 |
| 12 | 71 | 60 |
| 14 | 66 | 62 |
| 16 | 74 | 64 |
| 18 | 88 | 70 |
| 20 | 62 | 55 |
| 22 | 41 | 40 |
At a glance
| Charts | 60, enabled in every adapter, in 9 families: Lines, Bars, Areas, Points & grids, Flows, Radial, Distributions & comparisons, Hierarchies & dimensions, Fields & networks |
| Frameworks | React 18.2+ / 19 · Vue 3.5 · Angular 21–22 · and Python through Reflex |
| Integrations | Vite, Next.js (App Router, RSC), Angular CLI (with @angular/ssr) |
| Grounds | silverpoint (cream, green, blue, ochre) · cyanotype (prussian) |
| Composition | Dashboard: a responsive, linkable grid laid out from plain data |
| Drill-down | New in 0.6: SquarifiedTreemap and SunburstChart, under your control |
| UI components | 38: 17 since 0.3 (buttons, inputs, tabs, cards, alerts…), drawn as the charts are, and 21 new in 0.7: composed components and overlays |
| Palettes | New in 0.7: six presets named after drawing media, checked for contrast |
| Timeline | New in 0.7: Knight Lab TimelineJS drawn in silverpoint |
| Accessibility | Accessible names, hidden data tables, keyboard navigation, contrast fallbacks |
| Current version | 0.8.0 (2026-10-21) |
| License | MIT |
How it is built
Seven packages share one version. @silverpoint/core computes every scale, arc and layout, with no DOM and no framework. @silverpoint/grounds holds the grounds, their inkers and the stylesheet. The adapters (@silverpoint/react, @silverpoint/vue, @silverpoint/angular) only translate the core's geometry into their own markup: no maths in the adapters. CI parses each adapter's SVG and compares it as a tree against the canonical render.
@silverpoint/core ──► @silverpoint/grounds ──► @silverpoint/react (JSX)
├─► @silverpoint/vue (VNodes)
└─► @silverpoint/angular (templates)
│
reflex-silverpoint-react (Python) ◄──────────┘ wraps @silverpoint/reactWhere to go next
- Installation — what to install for each framework.
- Quickstarts: React · Vue · Angular · Reflex.
- Gallery — the 60 charts, live.
- Drill-down & hierarchies — the treemap and the sunburst of 0.6, drilled down under your control.
- Chart reference — props and code for each chart.
- UI components and their reference — the 17 interface components of 0.3.
- Report a bug — how to open a useful issue.