# Chartory

> Chartory is 132 chart types for Figma and React, in two collections: Hearth and Signal. Every chart is a Figma component and a React component with the same name, bound to one token system you can theme.

Every docs page has a Markdown twin (the page address + .md). The whole docs in one file: https://usechartory.com/llms-full.txt

## Plans
One payment, every update included. Compare: https://usechartory.com/pricing
- Free ($0): chart types 1–100 in Hearth as React components, MIT licensed, from the public @chartory registry with no token; source at https://github.com/chartory/charts.
- Figma ($149): The design kit for product designers. Includes: 100+ chart types, 900+ variants; Widget kit with swappable parts; Every collection, light and dark; Every Figma update.
- Code ($249): The React library for teams that ship. Includes: Every chart in Hearth and Signal; Widgets and overlays in React; Private registry, GitHub repo and MCP; Every code update.
- Complete ($349): Figma, code, sector packs and templates. Includes: Everything in Figma and Code; Six sector packs with datasets; New templates and sector packs.
- AI Ops template · Code ($129): the AI operations dashboard template as Next.js source, npx shadcn add @chartory/ai-ops (also in Complete).
- Licence: https://usechartory.com/licence · Refunds: https://usechartory.com/refunds · Free charts: https://usechartory.com/free

## Start here
- [Introduction](https://usechartory.com/docs.md): Chartory is 132 chart types for Figma and React, in two collections: Hearth and Signal. Every chart is a Figma component and a React component with the same name, bound to one token system you can theme.
- [Installation](https://usechartory.com/docs/installation.md): Chartory charts install from a shadcn registry. Free charts come from the public registry. The 100 free charts (MIT) need no token. Paid items need one: the licence key from your purchase email, or a token you create in Account · Access. Add it to .env, point components.json at the @chartory registry, then add a chart by its slug.
- [Registry token](https://usechartory.com/docs/registry-token.md): Your registry token unlocks the paid parts of the @chartory registry: types 101–132, Signal, widgets, overlays and the AI Ops template. The 100 free charts need none. Use the licence key from your Code or Complete email, or create your own token in Account · Access, where you can regenerate or revoke it. AI Ops · Code has no licence key: create a token there. The token is your access (your account's Access page shows it too), so keep it out of git and out of client code.
- [Agents: MCP and llms.txt](https://usechartory.com/docs/agents.md): Coding agents can find, install and set up Chartory charts on their own. Connect the MCP server, or point the agent at llms.txt and AGENTS.md, then ask for a chart in plain words.
- [Changelog](https://usechartory.com/changelog.md): 

## Foundations
- [Tokens](https://usechartory.com/docs/tokens.md): Every Hearth chart binds to Foundations variables: 220 tokens for surfaces, text, data, status and effects. Change the mode and all 100+ follow. Signal binds to its own token set. No chart holds a hex.
- [Colour](https://usechartory.com/docs/colour.md): Chartory colours come in two layers. The palette holds fourteen colour families in eleven steps. The roles name what a colour is for and point at a palette step in each mode, so a theme moves every Hearth chart at once. Every role below shows its contrast on the canvas in both Chartory modes.
- [Typography](https://usechartory.com/docs/typography.md): Twenty-nine text styles in eight families, set in Geist, with Geist Mono for code. Size, line height and tracking are variables, so one style resolves per breakpoint: display and headings scale down on tablet and mobile, interface, label and overline styles hold.
- [Spacing](https://usechartory.com/docs/spacing.md): Three spacing scales named by what sits on either side of the gap: layout between page regions, section between groups inside a region, component inside one part. Each step resolves per breakpoint, so a page tightens on tablet and mobile without new tokens.
- [Corners](https://usechartory.com/docs/corners.md): Corner radius in eleven steps, from none to full. Controls keep one radius at every breakpoint so a button never changes under your finger; surfaces such as cards, panels and sheets soften on smaller screens. Full makes pills, dots and avatars.
- [Shadows](https://usechartory.com/docs/shadows.md): Eight elevation shadows from a hairline to a floating sheet, plus the focus style. Each one is an effect style built from one or two drop shadows. Dark surfaces separate by tone first, so shadows stay quiet on dark and carry more of the depth in light.
- [Modes](https://usechartory.com/docs/modes.md): Foundations has four modes: Chartory Light, Chartory Dark, Ember and Ember Light. Every token has a value in each, so switching the mode restyles every Hearth chart at once.
- [Sizes](https://usechartory.com/docs/sizes.md): Every type ships in four sizes: XS, S, M and L. Each size redraws the chart from its data, so labels, legends and marks fit the card. Nothing is scaled.
- [Motion](https://usechartory.com/docs/motion.md): Data moves, chrome does not. Charts animate when they enter and when their data changes; frames, axes and labels stay still.

## Charts
- [All 100+ types](https://usechartory.com/docs/charts.md): Every chart type, grouped by the question it answers. Each one is a Figma component and a React component with the same name, and each page has its install command, props and sample data.
- [Props](https://usechartory.com/docs/props.md): Props are named like the Figma variants, so a chart reads the same on both sides. Every chart takes a size and its data; most also take a legend.
- [Data shape](https://usechartory.com/docs/data-shape.md): Each chart takes one data object in its own shape: the values, the scale they sit on and how labels read. The shape is fixed per type and published as a JSON Schema, so your editor and your agent can check it before anything renders.
- [Bars](https://usechartory.com/docs/charts/bars.md): One value per item, side by side. Sample data: monthly company card spend, January to September, 71K in July, September month to date.
- [Grouped bars](https://usechartory.com/docs/charts/grouped-bars.md): A few series, side by side in each period. Sample data: new paid accounts per month by plan (Starter, Team, Business), July to December.
- [Stacked bars](https://usechartory.com/docs/charts/stacked-bars.md): The total per period, and what it is made of. Sample data: failed payments per week by reason (card declined, insufficient funds, fraud block), W27 to W40.
- [Diverging bars](https://usechartory.com/docs/charts/diverging-bars.md): In and out, from one zero line. Sample data: weekly inflow and outflow, W29 to W40, on a ±400K axis.
- [Floating range bars](https://usechartory.com/docs/charts/floating-range-bars.md): A window per item, from start to end. Sample data: delivery windows of eight routes, R1 to R8, between 06:00 and 18:00.
- [Histogram](https://usechartory.com/docs/charts/histogram.md): How values spread across ranges. Sample data: response times from 0 to 900 ms, P50 250 ms, P95 475 ms.
- [Horizontal bars](https://usechartory.com/docs/charts/horizontal-bars.md): Items in a list, with room for their names. Sample data: parcels delivered at five hubs against the scheduled count, Rotterdam 1,312.
- [Bullet](https://usechartory.com/docs/charts/bullet.md): Each number against its target. Sample data: four quarter-to-date measures, revenue $428K of $500K, orders 6,120 of 7,000.
- [Lollipop](https://usechartory.com/docs/charts/lollipop.md): A slim bar with a marker at the value. Sample data: new deposits in four regions, South $596K, West $174K.
- [Line](https://usechartory.com/docs/charts/line.md): One value, read as a trend. Sample data: P95 latency, us-east, last 24 hours.
- [Area](https://usechartory.com/docs/charts/area.md): A trend with weight under it. Sample data: spot price, Sep 10 to Oct 9.
- [Multi-line](https://usechartory.com/docs/charts/multi-line.md): A few series on one time axis. Sample data: P95 time to first token in four regions, last 24 hours.
- [Overlapping areas](https://usechartory.com/docs/charts/overlapping-areas.md): A few volumes, seen through each other. Sample data: daily spot volume on three venues, Sep 10 to Oct 9.
- [Streamgraph](https://usechartory.com/docs/charts/streamgraph.md): How the mix shifts through the year. Sample data: shipments by four modes, January to December, October at 47K.
- [Forecast band](https://usechartory.com/docs/charts/forecast-band.md): Where it is heading, and how sure we are. Sample data: cash on hand, May to April, actual to October, P10–P90 band.
- [Vertical profile](https://usechartory.com/docs/charts/vertical-profile.md): A value read down a scale, like a depth profile. Sample data: recall of Atlas 3 and Kite 2 Pro from 4K to 128K context, on a 60% to 100% scale.
- [Donut](https://usechartory.com/docs/charts/donut.md): One total, split into a few parts. Sample data: monthly recurring revenue by plan, Enterprise $82K (45%), Starter $17K (9%).
- [Semi donut](https://usechartory.com/docs/charts/semi-donut.md): A split under one headline number. Sample data: 3,412 orders by channel, web 52%, app 28%, market 14%, retail 7%.
- [Polar area](https://usechartory.com/docs/charts/polar-area.md): Parts as wedges, sized by their value. Sample data: new trial signups by channel, organic 4.2K (30%), events 0.6K (4%).
- [Progress ring](https://usechartory.com/docs/charts/progress-ring.md): How much of a quota is used. Sample data: 72% of the token quota used, 7.2M used, 2.8M remaining, resets in 9 days.
- [Gauge](https://usechartory.com/docs/charts/gauge.md): One reading on a dial, with a limit marked. Sample data: fleet utilisation today, overload above 85%.
- [Sunburst](https://usechartory.com/docs/charts/sunburst.md): Parts and their sub-parts, in rings. Sample data: $48.2K spend this month by team, research $20.2K, agents $3.0K.
- [Radar](https://usechartory.com/docs/charts/radar.md): Two profiles across the same axes. Sample data: Atlas 3 and Kite 2 Pro scored on reasoning, code, math, tool use, speed and cost.
- [Heatmap](https://usechartory.com/docs/charts/heatmap.md): Two dimensions, shaded by value. Sample data: card transactions by weekday and hour over 7 days, the busiest cells at 398 and 412.
- [Calendar heatmap](https://usechartory.com/docs/charts/calendar-heatmap.md): Every day of a season in one grid. Sample data: production deploys per day, last 20 weeks, May to September.
- [Cohort](https://usechartory.com/docs/charts/cohort.md): How each group holds on over time. Sample data: monthly cohorts April to September, revenue retention, 86% to 91% at month 2.
- [Cells matrix](https://usechartory.com/docs/charts/cells-matrix.md): Clusters across two sets of categories. Sample data: requests across 16 topics in code, support, search and agents, by size from 128 to 16K, one cell marked at 1,284.
- [Hex grid](https://usechartory.com/docs/charts/hex-grid.md): Where clicks pile up on a page. Sample data: clicks on three key pages, product 16.1K, home 14.2K, checkout 8.3K.
- [Tile map](https://usechartory.com/docs/charts/tile-map.md): Countries as equal tiles, shaded by value. Sample data: parcels delivered in 16 European countries, Germany 12.4K, Netherlands 10.1K.
- [Treemap](https://usechartory.com/docs/charts/treemap.md): Many parts in groups, sized by value. Sample data: net sales by subcategory in apparel, home, beauty and outdoor, shirts $84K.
- [Sankey](https://usechartory.com/docs/charts/sankey.md): Where things come from and where they go. Sample data: sessions from four sources to four outcomes, search 4,200, purchased 2,100.
- [Funnel](https://usechartory.com/docs/charts/funnel.md): How many make it to each step. Sample data: 48.2K site visits to 0.4K annual plans, 26% of visits sign up.
- [Dot strip](https://usechartory.com/docs/charts/dot-strip.md): The full range per item, on one scale. Sample data: payout times for six rails, instant card 0.1 to 0.4 days, cheque 4.0 to 7.5 days.
- [Scatter](https://usechartory.com/docs/charts/scatter.md): Two measures per item, as dots. Sample data: 30-day return against volatility for BTC, ETH and tokens in layer 1, DeFi and meme groups.
- [Packed bubbles](https://usechartory.com/docs/charts/packed-bubbles.md): Items as bubbles, sized by volume. Sample data: spot volume by asset, ETH +5.8%, SOL −3.4%.
- [Candlestick](https://usechartory.com/docs/charts/candlestick.md): Open, high, low and close, per period. Sample data: spot price in four-hour candles, Sep 30 to Oct 9.
- [Gantt](https://usechartory.com/docs/charts/gantt.md): Who is busy when, lane by lane. Sample data: trucks at six docks from 06:00 to 14:00, loading, unloading, waiting and delayed.
- [Block timeline](https://usechartory.com/docs/charts/block-timeline.md): Each team's items and their status. Sample data: items across core, growth, platform and mobile squads, shipped, in progress, blocked and planned.
- [Network](https://usechartory.com/docs/charts/network.md): One hub and what it connects to. Sample data: one agent on Atlas 3 and its six tools, search 12.4K calls (32%), files 2.7K (7%).
- [Tree](https://usechartory.com/docs/charts/tree.md): A release, its epics and their tasks. Sample data: release v4.2 (Dec 05), its epics and their tasks, each with a status colour (shipped, in progress, review, todo, blocked).
- [Orbit](https://usechartory.com/docs/charts/orbit.md): Tiers around a centre, with how active each is. Sample data: active wallets in four tiers, whales 42 (92% active), small 10.2K (64% active).
- [Waterfall](https://usechartory.com/docs/charts/waterfall.md): Opening to closing value, one step at a time. Sample data: Q3 2026 cash bridge, $1.82M opening to $1.91M closing.
- [Box plot](https://usechartory.com/docs/charts/box-plot.md): The spread of each group in five numbers. Sample data: response latency of five models, Atlas 3 to Nova, on a 0 to 1.2 s scale.
- [Slope](https://usechartory.com/docs/charts/slope.md): Before and after, one line per item. Sample data: store conversion by channel, September to October, email 4.1% to 5.2%.
- [Bump](https://usechartory.com/docs/charts/bump.md): Who leads, week by week. Sample data: weekly trading-volume rank of five tokens, weeks 33 to 40.
- [Bar and line combo](https://usechartory.com/docs/charts/bar-and-line-combo.md): An amount and a rate on one card. Sample data: new MRR by month, January to October, with monthly churn.
- [Marimekko](https://usechartory.com/docs/charts/marimekko.md): Two splits in one block. Sample data: net sales by region (NA 38%, EU 30%, APAC 20%) and four categories inside each.
- [Chord](https://usechartory.com/docs/charts/chord.md): Flows between peers, around a circle. Sample data: bridged volume between five chains, Base +$319M net in, Polygon −$146M net out.
- [Parallel coordinates](https://usechartory.com/docs/charts/parallel-coordinates.md): Many items across many measures. Sample data: five models on accuracy, speed, cost, safety and context.
- [Dot plot with intervals](https://usechartory.com/docs/charts/dot-plot-with-intervals.md): Estimates with how sure they are. Sample data: on-time delivery of six carriers with confidence intervals, against a 95% SLA.
- [Spiral year](https://usechartory.com/docs/charts/spiral-year.md): A year of weeks, wound into one coil. Sample data: active workspaces per week over one year, with a 9-week streak above 2K.
- [Radial hour heatmap](https://usechartory.com/docs/charts/radial-hour-heatmap.md): A week of hours around a clock. Sample data: deliveries over 4 weeks by weekday and hour, peak slot Thu 18:00.
- [Order book depth](https://usechartory.com/docs/charts/order-book-depth.md): Buy and sell orders stacked away from the price. Sample data: an order book around a mid of 64,210.
- [Horizon](https://usechartory.com/docs/charts/horizon.md): Many series, folded into thin rows. Sample data: daily volatility of four currency pairs against its average, Aug 11 to Oct 9.
- [Ridgeline](https://usechartory.com/docs/charts/ridgeline.md): The shape of each group's spread, stacked. Sample data: response length of five models, Atlas 3 to Nova, from 0 to 2K tokens.
- [Renko](https://usechartory.com/docs/charts/renko.md): Price, counted in fixed bricks. Sample data: spot price in $50 bricks, Sep 10 to Oct 9.
- [Route line](https://usechartory.com/docs/charts/route-line.md): One route, stop by stop, done and to come. Sample data: one van's route, depot at 07:30 to depot at 11:40, now at Elm Park.
- [Yard map](https://usechartory.com/docs/charts/yard-map.md): Every dock door and what is at it. Sample data: 12 dock doors and the yard, loading, loaded, reefer and waiting 2 h+.
- [Shelf planogram](https://usechartory.com/docs/charts/shelf-planogram.md): Shelves, facing by facing, with stock levels. Sample data: three dairy shelves, 15 products from OAT to MOZZ, healthy, low and out of stock.
- [Gains curve](https://usechartory.com/docs/charts/gains-curve.md): How much a model finds in its top picks. Sample data: a churn model, the top 20% of accounts hold 61% of churners.
- [Event barcode](https://usechartory.com/docs/charts/event-barcode.md): Every event as a thin line, by service. Sample data: requests to chat API, embeddings and agents over 24 hours, OK, slow and error.
- [Rate dot plot](https://usechartory.com/docs/charts/rate-dot-plot.md): Each member's view, year by year. Sample data: member views of the rate for 2026, 2027, 2028 and the longer run, between 2.0% and 4.5%.
- [Likert](https://usechartory.com/docs/charts/likert.md): Agree and disagree, statement by statement. Sample data: five statements, easy to set up 12% disagree and 74% agree.
- [Arc diagram](https://usechartory.com/docs/charts/arc-diagram.md): Flows between groups, as arcs on one line. Sample data: on-chain transfers between seven wallet types, from exchanges to miners.
- [Ring grid](https://usechartory.com/docs/charts/ring-grid.md): One small ring per site, in a grid. Sample data: same-day dispatch at eight sites, Brno 99%, Ghent 89%.
- [Dumbbell](https://usechartory.com/docs/charts/dumbbell.md): Two values per item, and the gap between them. Sample data: our price against the rival's for six outdoor products, gaps from −$10 to +$7.
- [Marey schedule](https://usechartory.com/docs/charts/marey-schedule.md): Vehicles moving through stops, against the plan. Sample data: four vans through six stops from 08:00 to 12:00, Van 19 late.
- [Icicle](https://usechartory.com/docs/charts/icicle.md): A breakdown in stacked rows. Sample data: inference spend by team and use case, support $18.4K (chat bot $11.2K, triage $7.2K).
- [Venn](https://usechartory.com/docs/charts/venn.md): Who uses one, two or all three. Sample data: active accounts using dashboards (2,550, 71%), alerts (1,540, 43%) and the API (1,360, 38%).
- [Uptime bars](https://usechartory.com/docs/charts/uptime-bars.md): Each day of each service, as a bar. Sample data: three services over 63 days, API 99.98%, dashboard 99.99%, webhooks 99.91%.
- [Volume profile](https://usechartory.com/docs/charts/volume-profile.md): Where the trading happened, by price. Sample data: spot price, Oct 8 to now, point of control at 150.5.
- [Quadrant](https://usechartory.com/docs/charts/quadrant.md): Items in four zones that tell you what to do. Sample data: products by growth (−20% to +60%) and margin (0 to 60%), grow, protect, fix margin and review.
- [Term cloud](https://usechartory.com/docs/charts/term-cloud.md): The words people use, sized by weight. Sample data: support conversations, 20 terms.
- [Flame graph](https://usechartory.com/docs/charts/flame-graph.md): Where the time went in one run. Sample data: one agent run of 8.4 s, plan, research and answer, coloured by model, tool, retrieval and wait.
- [Reconciliation](https://usechartory.com/docs/charts/reconciliation.md): Two lists matched line by line. Sample data: bank feed against ledger, NORDIC $9,100 against INV-4480 $9,000, a $35 bank fee with no match.
- [Load plan](https://usechartory.com/docs/charts/load-plan.md): How full each truck is, and with what. Sample data: three trucks, Hamburg 92%, Bremen 88%, Kiel 81% full.
- [Lorenz curve](https://usechartory.com/docs/charts/lorenz-curve.md): How evenly something is shared. Sample data: stake across holders, the top 10% hold 30%.
- [Battery cells](https://usechartory.com/docs/charts/battery-cells.md): Charge per unit, like a row of batteries. Sample data: charge across eight vans, Van 22 at 18%, two vans charging.
- [Milestone track](https://usechartory.com/docs/charts/milestone-track.md): How many reach each milestone, and when. Sample data: onboarding from signed up on day 0 (100%) to paid on day 14 (18%).
- [Underwater drawdown](https://usechartory.com/docs/charts/underwater-drawdown.md): How far below the last peak, and for how long. Sample data: fund drawdown, January to October, max −16.5%.
- [Context ruler](https://usechartory.com/docs/charts/context-ruler.md): What fills a model's context window. Sample data: context of four requests on a 128K scale, split into system, history, tools, docs and output.
- [Age pyramid](https://usechartory.com/docs/charts/age-pyramid.md): Two groups by age, back to back. Sample data: active customers by age, new against returning, 25–34 at 28% and 24%.
- [Deal pipeline](https://usechartory.com/docs/charts/deal-pipeline.md): Value at each stage, and how fresh it is. Sample data: open pipeline from lead ($120K) to won ($122K), fresh, aging 21+ days and stuck 45+ days.
- [Stock sawtooth](https://usechartory.com/docs/charts/stock-sawtooth.md): Stock on hand, drawn down and refilled. Sample data: units on hand, Aug 11 to Oct 9, reorder point 300, one stockout.
- [Correlation triangle](https://usechartory.com/docs/charts/correlation-triangle.md): How every pair moves together. Sample data: six coins, tightest ETH · BTC 0.86, loosest TON · SOL −0.06.
- [Punch card](https://usechartory.com/docs/charts/punch-card.md): Activity by weekday and hour, as sized dots. Sample data: API calls by weekday and hour, Monday to Sunday, 00 to 23.
- [Bowtie](https://usechartory.com/docs/charts/bowtie.md): Win the customer, then grow the revenue. Sample data: 48K visits to 420 won deals, then $61K onboard to $124K expand.
- [Isochrone rings](https://usechartory.com/docs/charts/isochrone-rings.md): How far you get from one point in set times. Sample data: stops around one depot in 15-minute rings, 48% under 30 min, 11 late stops.
- [Drift arrows](https://usechartory.com/docs/charts/drift-arrows.md): How far each part drifted from its target. Sample data: six assets against target, US equity +3.0 pt, intl equity −4.0 pt.
- [Funding stripes](https://usechartory.com/docs/charts/funding-stripes.md): Who pays whom, one stripe per period. Sample data: funding rate per 8 hours with the BTC price, Jul 12 to Oct 9.
- [Cluster map](https://usechartory.com/docs/charts/cluster-map.md): Similar items grouped into named clusters. Sample data: support tickets in five clusters, billing, login and SSO, integrations, bugs and feature asks.
- [Tachograph](https://usechartory.com/docs/charts/tachograph.md): A driver's day in driving, other work, rest and availability. Sample data: three drivers' days, R. Silva 8.0 h, T. Brandt 6.5 h, M. Kaya 8.5 h driving.
- [Star ratings](https://usechartory.com/docs/charts/star-ratings.md): The average and how the stars split. Sample data: reviews averaging 4.3, 1,412 five-star and 82 one-star.
- [Radial lollipop](https://usechartory.com/docs/charts/radial-lollipop.md): A year of values around one ring. Sample data: network hashrate in EH/s, 12 months, November to October.
- [Ternary](https://usechartory.com/docs/charts/ternary.md): Items placed by three measures that trade off. Sample data: five models placed by quality, speed and low cost.
- [Shipment journey](https://usechartory.com/docs/charts/shipment-journey.md): One shipment, stage by stage. Sample data: one shipment, picked up Oct 1, delivered Oct 14 (ETA), by warehouse, sea, customs and road.
- [Isotype](https://usechartory.com/docs/charts/isotype.md): Counts drawn as rows of icons. Sample data: orders by channel, one box = 100, web 1,840, retail 310.
- [Cash cycle ring](https://usechartory.com/docs/charts/cash-cycle-ring.md): How long cash is tied up, in one ring. Sample data: a 41-day cash cycle, inventory 46 days, receivables 38 days, payables 43 days.
- [Pass/fail grid](https://usechartory.com/docs/charts/pass-fail-grid.md): Every model against every test. Sample data: five models across eight suites from math to safety, pass, flaky and fail.
- [Split calendar](https://usechartory.com/docs/charts/split-calendar.md): Money in and out, day by day. Sample data: September cash, biggest in Sep 15 ($164K), biggest out Sep 30 ($178K), 8 quiet days.
- [Budget runway](https://usechartory.com/docs/charts/budget-runway.md): Spend to date against the budget, and where it lands. Sample data: model spend in October, $10,214 to date, $19,640 forecast against a $20K budget.
- [Eval suite bars](https://usechartory.com/docs/charts/eval-suite-bars.md): Pass rate per eval suite, against its own target. Sample data: six eval suites, refunds-v4 95.8% (46 / 48), invoices-v9 100% (120 / 120).
- [Weekly rhythm](https://usechartory.com/docs/charts/weekly-rhythm.md): A week of runs, by day and hour. Sample data: agent runs this week by weekday and hour, Monday to Sunday.
- [Runs with brush](https://usechartory.com/docs/charts/runs-with-brush.md): A week of runs, with the moment that matters in focus. Sample data: agent runs and success rate, Oct 10 to Oct 16, 96.2% today, one deploy and one incident marked.
- [Target trend](https://usechartory.com/docs/charts/target-trend.md): A measure against its target, and when it slipped. Sample data: P95 run time, last 6 hours, 9.1 s against a 5 s target, doubled since 09:40.
- [Latency field](https://usechartory.com/docs/charts/latency-field.md): Every run as a dot, over time. Sample data: runs from 09:35 to now, P50 2.3 s, P95 7.8 s, incident at 09:52.
- [Span waterfall](https://usechartory.com/docs/charts/span-waterfall.md): One run's steps, and where the time went. Sample data: one 9.1 s run, plan 0.8 s, six fetches 6.1 s, write 1.7 s, 4.4 s after the fix.
- [Case strip dumbbell](https://usechartory.com/docs/charts/case-strip-dumbbell.md): Where the new version fixed or broke cases. Sample data: eight areas, v13 production against v14 candidate, tool choice +12.5 pt, tone −8.3 pt.
- [Frontier map](https://usechartory.com/docs/charts/frontier-map.md): Models on quality against cost, with the best edge. Sample data: five models on quality against cost, with four suggested moves.
- [Incident tape](https://usechartory.com/docs/charts/incident-tape.md): One incident, minute by minute. Sample data: P95 run time during one incident, 09:30 to 10:40, first over 8 s at 09:42, 6 min from alert to acknowledged.
- [Threshold what-if](https://usechartory.com/docs/charts/threshold-what-if.md): What a new alert threshold would have done. Sample data: hourly success rate, Oct 10 to today, 14 alerts at 96%, 3 at a proposed 95%.
- [Threshold sweep](https://usechartory.com/docs/charts/threshold-sweep.md): Alerts per week at every threshold. Sample data: alerts per week from 93% to 97%, 14 at 96% now, 3 at a proposed 95%.
- [Burn-down](https://usechartory.com/docs/charts/burn-down.md): A budget used up through the month. Sample data: October error budget, 27.7 min left after 4 incidents.
- [Burn-rate tracks](https://usechartory.com/docs/charts/burn-rate-tracks.md): Burn rate in four windows, against the paging rules. Sample data: burn rate 6.2× in the last hour against a page at 14.4×, 0.73× this month.
- [Dependency map](https://usechartory.com/docs/charts/dependency-map.md): What a service relies on, and what is failing. Sample data: clients, runtime, five models and four tools, Orion XL degraded at P95 7.9 s.
- [Money flow](https://usechartory.com/docs/charts/money-flow.md): Where the spend went, useful or wasted. Sample data: model spend, answers $7,394 against $940 on retries and $340 failed.
- [Version ribbon](https://usechartory.com/docs/charts/version-ribbon.md): Each version, scored on three measures. Sample data: success, cost and tokens per version, v9 to v14, 97.6% for the v14 candidate.
- [Coverage map](https://usechartory.com/docs/charts/coverage-map.md): Real traffic, and which parts the tests cover. Sample data: eight clusters, full refunds 31% with 46 cases, partial + coupon 14% with 0 cases.
- [Traffic vs set](https://usechartory.com/docs/charts/traffic-vs-set.md): Real traffic against the test set, cluster by cluster. Sample data: eight request clusters, full refunds 31% of traffic and 38% of the set, partial + coupon 14% and 0%.
- [Key timeline](https://usechartory.com/docs/charts/key-timeline.md): API keys, their use and when they expire. Sample data: seven keys from Sep 16 to Nov 14, rotation on Sat 24, prod-runtime at 1.2M calls in 30 days.
- [Reach tree](https://usechartory.com/docs/charts/reach-tree.md): Everything one key can reach. Sample data: the refunds-legacy key, write access to the refunds API (issues refunds ≤ $500) and payments, read access to orders.
- [Ownership matrix](https://usechartory.com/docs/charts/ownership-matrix.md): Each agent's parts, owners and health. Sample data: six agents across prompt, eval, alert, key and budget, the refunds agent's prompt v14 approved, waiting on you.
- [Rota lanes](https://usechartory.com/docs/charts/rota-lanes.md): Who is on call, and for how long. Sample data: on-call from Fri 16 to Thu 29, your shifts against Leo's and Ana's, key rotation Sat 06:00.
- [Replay lanes](https://usechartory.com/docs/charts/replay-lanes.md): Where each alert went: pager, chat or digest. Sample data: alerts from Fri 9 to Fri 16, 1 paged right away, 8 to chat, 22 held for the digest.
- [Session lanes](https://usechartory.com/docs/charts/session-lanes.md): Every signed-in device, over time. Sample data: five devices from Sep 16 to Oct 14, an unknown device blocked after a failed passkey.
- [Load bars](https://usechartory.com/docs/charts/load-bars.md): Who owns how much, by kind of work. Sample data: items per owner across agents, prompts, eval suites, alert rules and API keys, team average 13.3.
- [Permission matrix](https://usechartory.com/docs/charts/permission-matrix.md): Roles against actions, used and unused. Sample data: admin, editor, viewer and a draft role across seven actions, from pausing agents to viewing billing.
- [Limit tracks](https://usechartory.com/docs/charts/limit-tracks.md): Each plan limit, used so far and forecast. Sample data: five October limits, runs 410K of 1M, storage 280 of 500 GB.
- [Break-even](https://usechartory.com/docs/charts/break-even.md): When the next plan becomes cheaper. Sample data: cost of the current plan (Scale) and Enterprise across 0.6M to 2.2M runs, break-even at 1.6M.
- [Retention cut](https://usechartory.com/docs/charts/retention-cut.md): What a retention window keeps and frees. Sample data: stored traces by age, a 60-day cut keeps 222 GB and frees 90 GB, against today's 90 days.
- [Alert fire strip](https://usechartory.com/docs/charts/alert-fire-strip.md): Each alert rule, how often it fired and if anyone acted. Sample data: six rules, refund success 14 alerts with 7% acted on.
- [Invoice split](https://usechartory.com/docs/charts/invoice-split.md): Each month's bill, split by what it pays for. Sample data: four invoices, July to October, October $20,840 estimated, September $18,912 paid.

## Widgets
- [Hearth widget](https://usechartory.com/docs/hearth-widget.md): Hearth is the widget kit: one shell with a header, a chart, up to two blocks and a footer. Every part is a component you swap, so one shell makes every widget. Widgets come with Code and Complete.
- [Signal widget](https://usechartory.com/docs/signal-widget.md): Signal is the second widget language: the same shell, parts and props as Hearth, drawn flat and straight for AI and ops products. Hairline cards, sentence case, no shadows. Signal and its widgets come with Code and Complete.
- [Blocks](https://usechartory.com/docs/blocks.md): Eleven blocks sit under the chart. Each adds one kind of detail, and none repeats what the chart already shows.

## Resources
- [AGENTS.md](https://usechartory.com/docs/agents-md.md): A short file for your repository that tells coding agents how to use Chartory: how to install a chart, which tokens to use and what never to do.
- [Prompt cookbook](https://usechartory.com/docs/prompt-cookbook.md): Prompts that get the right chart on the first try. Each one names the question, the data and the size.

## Compare
- [Chart comparisons, side by side](https://usechartory.com/compare): Pairs of charts that answer the same question, drawn from the same data.
- [Funnel vs sankey](https://usechartory.com/compare/funnel-vs-sankey.md): Two ways to show flow. Use a funnel when the same people drop out step by step and only the count matters. Use a sankey when volume splits, merges or comes from several sources, and you need to see where each part goes.
- [Line vs area](https://usechartory.com/compare/line-vs-area.md): Two ways to show a value over time. Use a line when the direction matters: a rate, a latency, a price you watch move. Use an area when the amount matters too: a balance, a volume, a total you want to feel.
- [Bars vs horizontal bars](https://usechartory.com/compare/bars-vs-horizontal-bars.md): Two ways to compare amounts. Use vertical bars for a few items or for periods of time, read left to right. Use horizontal bars when names are long or there are many items, so the list reads top to bottom.
- [Stacked vs grouped bars](https://usechartory.com/compare/stacked-vs-grouped-bars.md): Two ways to show parts over time. Use stacked bars when the total per period matters and the parts make it up. Use grouped bars when you compare the parts with each other, period by period.
- [Treemap vs sunburst](https://usechartory.com/compare/treemap-vs-sunburst.md): Two ways to show parts inside parts. Use a treemap when there are many parts and you want to see them all at once, as rectangles. Use a sunburst for a round view of a total, its parts and their sub-parts, when the levels matter more than exact sizes.
- [Donut vs semi donut](https://usechartory.com/compare/donut-vs-semi-donut.md): Two ways to split one total. Use a donut when each part's amount and share matter, with a list beside the chart. Use a semi donut when one headline total leads and the split sits under it in a short card.
- [Histogram vs box plot](https://usechartory.com/compare/histogram-vs-box-plot.md): Two ways to show a spread. Use a histogram to see the full shape of one group: where values pile up and how long the tail is. Use a box plot to compare the spread of several groups side by side in five numbers each.
- [Slope vs dumbbell](https://usechartory.com/compare/slope-vs-dumbbell.md): Two ways to show before and after. Use a slope chart when the change between two points in time is the story: risers and fallers show by the angle. Use a dumbbell when you compare two values per item, such as ours and a rival's, and the gap is the story.
- [Gantt vs block timeline](https://usechartory.com/compare/gantt-vs-block-timeline.md): Two ways to show a schedule. Use a Gantt chart when exact start and end times matter and lanes share one time axis. Use a block timeline when the status of each item matters more than its dates, team by team.
- [Sankey vs chord](https://usechartory.com/compare/sankey-vs-chord.md): Two ways to show flows. Use a sankey when flows run one way, from sources on the left to outcomes on the right. Use a chord diagram when the same groups send to and receive from each other, and the net in or out matters.
- [Candlestick vs line](https://usechartory.com/compare/candlestick-vs-line.md): Two ways to show a price. Use candlesticks when the range inside each period matters: open, high, low and close. Use a line when only the closing price matters and you want the trend at a glance.
- [Bullet vs gauge](https://usechartory.com/compare/bullet-vs-gauge.md): Two ways to show a value against a target. Use a bullet chart to show several measures against their targets in one compact card, with ranges behind. Use a gauge for one headline reading and how close it is to a limit.
- [Radar vs parallel coordinates](https://usechartory.com/compare/radar-vs-parallel-coordinates.md): Two ways to compare profiles. Use a radar chart to compare two or three profiles by their shape across the same axes. Use parallel coordinates to compare many items across many measures and see the trade-offs as crossing lines.

## Sector metrics
- [Charts for the metrics you report](https://usechartory.com/metrics): One chart per sector metric, with the data it needs and what goes next to it.
- [SaaS MRR chart](https://usechartory.com/metrics/saas/mrr-churn.md): Show the MRR trend and its cause together. Show new MRR as monthly bars with a line for churn: the bars give the growth, the line shows what leaks out. To see what moved MRR in one month, add a waterfall of new, expansion, contraction and churn.
- [AI model spend chart](https://usechartory.com/metrics/ai/model-spend.md): Show spend against the budget, and where the month lands. Show spend to date as a building area split by model, the budget as a line and a forecast to the end of the month. To explain the forecast, add a waterfall from spend to date to the budget.
- [Cash runway chart](https://usechartory.com/metrics/fintech/cash-runway.md): Show cash on hand, where it is heading, and the events ahead. Show cash on hand as a line with a forecast band ahead of it, so the runway and its range read together. To explain the next weeks, add a waterfall of the cash events ahead.
- [Portfolio drawdown chart](https://usechartory.com/metrics/crypto/drawdown.md): Show how far below the peak, and for how long. Show the drawdown as a fill below zero over time, with the deepest point marked: depth and duration read together. To explain the current drawdown, add a waterfall from the peak to today by asset.
- [On-time delivery chart](https://usechartory.com/metrics/logistics/on-time-delivery.md): Show each carrier against the SLA, and how sure the rate is. Show each carrier's on-time rate as a dot with its confidence interval against the SLA line, so carriers that are really below stand apart from the uncertain ones. To explain the late deliveries, add a waterfall by cause.
- [E-commerce net revenue chart](https://usechartory.com/metrics/e-commerce/net-revenue.md): Show net revenue, its channel mix and what it lost on the way. Show net revenue as the headline with its split by channel in a semi donut, so the total and the mix read in one card. To explain the gap to gross sales, add a waterfall of discounts and returns.

## Questions
- [The best chart for part of a whole](https://usechartory.com/questions/part-of-a-whole.md): Fourteen charts, and when each one fits. For a few parts that add up to one total, use a donut. To see the split change over time, use stacked bars. With many parts or a hierarchy, use a treemap or a sunburst. To compare the split across groups, use a marimekko.
- [The best chart for change over time](https://usechartory.com/questions/change-over-time.md): Twenty-four charts, and when each one fits. For one measure over time, use a line. When the amount matters, use an area. For a day-by-day pattern, use a calendar heatmap. With several series, use a multi-line chart, and with a forecast, a forecast band.
- [The best chart to compare items](https://usechartory.com/questions/compare-items.md): Nineteen charts, and when each one fits. To compare amounts, use bars; with long names or many items, horizontal bars. For two values per item, use a dumbbell; for before and after, a slope chart. Against a target, use a bullet chart.
- [The best chart for a distribution](https://usechartory.com/questions/distribution.md): Seventeen charts, and when each one fits. For the shape of one group, use a histogram. To compare the spread of several groups, use a box plot, or a ridgeline when the shape matters. For a range per item, use a dot strip; for estimates with uncertainty, a dot plot with intervals.
- [The best chart for flow between steps](https://usechartory.com/questions/flow-between-steps.md): Eleven charts, and when each one fits. For one path that narrows, use a funnel. When volume splits, merges or comes from several sources, use a sankey. To walk from one total to another through gains and losses, use a waterfall. For flows between peers, use a chord.
- [The best chart for a relationship](https://usechartory.com/questions/relationship.md): Seventeen charts, and when each one fits. To see how two measures relate, use a scatter plot. To turn it into decisions, split it into a quadrant. For how every pair of measures moves together, use a correlation triangle. For links between items, use a network; for three trade-offs, a ternary.
- [The best chart for schedules and status](https://usechartory.com/questions/schedule-and-status.md): Nineteen charts, and when each one fits. For who is busy when, use a Gantt chart. For each item's window, use floating range bars. For every event in time, use an event barcode. For status day by day, use uptime bars; for a team's items and their status, a block timeline.
- [The best chart for space and place](https://usechartory.com/questions/space-and-place.md): Nine charts, and when each one fits. For values by country or state, use a tile map. For events on a surface, such as clicks, use a hex grid. For reach from one point, use isochrone rings, and for a route, a route line. When the ranking matters more than the map, use bars.

## Glossary
- [Area](https://usechartory.com/glossary/area.md): The filled space under a line, read for volume over time.
- [Axis](https://usechartory.com/glossary/axis.md): The scale along the edge of a plot that gives marks their value.
- [Baseline](https://usechartory.com/glossary/baseline.md): The zero or reference line that bars grow from.
- [Bin](https://usechartory.com/glossary/bin.md): A range of values grouped into one bar, so a distribution shows its shape.
- [Bubble](https://usechartory.com/glossary/bubble.md): A circle whose area carries a value.
- [Category](https://usechartory.com/glossary/category.md): A named group a mark belongs to, such as a plan or a region.
- [Cohort](https://usechartory.com/glossary/cohort.md): A group that started in the same period, followed over time.
- [Confidence interval](https://usechartory.com/glossary/confidence-interval.md): The range a value likely falls in, drawn as a band or a whisker.
- [Cumulative](https://usechartory.com/glossary/cumulative.md): A running total: each point adds everything before it.
- [Delta](https://usechartory.com/glossary/delta.md): The change against an earlier period, shown next to the hero value.
- [Distribution](https://usechartory.com/glossary/distribution.md): How values spread across a range: where they cluster and where they thin out.
- [Diverging scale](https://usechartory.com/glossary/diverging-scale.md): Values that run in two directions from a midpoint, such as gains and losses.
- [Domain](https://usechartory.com/glossary/domain.md): The range of values an axis covers, from its lowest to its highest tick.
- [Encoding](https://usechartory.com/glossary/encoding.md): The visual property that carries a value: length, position, angle, area or colour.
- [Flow](https://usechartory.com/glossary/flow.md): Volume moving from one stage or place to another.
- [Gridline](https://usechartory.com/glossary/gridline.md): A faint line across the plot at each tick, so values read without a ruler.
- [Hierarchy](https://usechartory.com/glossary/hierarchy.md): Parts that sit inside other parts, several levels deep.
- [Legend](https://usechartory.com/glossary/legend.md): The key that names each colour or mark.
- [Mark](https://usechartory.com/glossary/mark.md): One drawn shape that stands for one data point: a bar, a dot or a slice.
- [Median](https://usechartory.com/glossary/median.md): The middle value: half the data sits above it, half below.
- [Outlier](https://usechartory.com/glossary/outlier.md): A value far from the rest, drawn on its own so it is not hidden.
- [Quartile](https://usechartory.com/glossary/quartile.md): The values that cut sorted data into four equal parts; the box in a box plot.
- [Range](https://usechartory.com/glossary/range.md): The span between a low and a high value, drawn as one bar or one line.
- [Ranking](https://usechartory.com/glossary/ranking.md): Order by value; a bump chart follows how the order changes.
- [Series](https://usechartory.com/glossary/series.md): One set of values drawn together, such as one line or one colour of bars.
- [Share](https://usechartory.com/glossary/share.md): A part divided by its total, read as a percent.
- [Size class](https://usechartory.com/glossary/size-class.md): One of four fixed chart sizes, XS to L, each laid out on its own.
- [Small multiples](https://usechartory.com/glossary/small-multiples.md): The same chart repeated per group on one shared scale.
- [Stacked](https://usechartory.com/glossary/stacked.md): Parts placed on top of each other so the total stays visible.
- [Tick](https://usechartory.com/glossary/tick.md): A small mark on an axis at a round value, with its label.
- [Time series](https://usechartory.com/glossary/time-series.md): Values recorded at regular moments, drawn left to right.
- [Tooltip](https://usechartory.com/glossary/tooltip.md): The label that appears on hover with the exact value.
- [Whisker](https://usechartory.com/glossary/whisker.md): The line from a box to the lowest and highest values that are not outliers.