Skip to content
The catalog

106 React microcharts, at true size.

Every chart at the size it lives (in a sentence, a table cell, a KPI card), beside the decision it answers. Browse by collection or search. Live by default — hover a mark to scrub; switch to Static in the dock if you want stillness.

Find by question
CoreEveryday charts.34
Sparkline

A trend over ordered values, small enough to sit in a sentence.

core
SparkBar

Compact bars for magnitude, or a win–loss streak of outcomes.

core
+18.4%
Delta

A signed change, double-encoded by glyph and color.

core
Bullet

A measure against a target and qualitative bands.

core
ActivityGrid

Calendar or matrix intensity: the contribution-graph shape.

core
TrendArrow

Which way is this moving? At glyph size, before any number.

core
StatusDot

What state is this thing in: shape and color paired, never color alone.

core
HeatCell

One calibrated color step: the building block for host-owned grids.

core
Progress

How far along, exactly: bar plus the percent that is the datum.

core
RugStrip

Where the raw observations actually sit: distribution without binning.

core
MiniBar

Which category is biggest, and by roughly how much.

core
PictogramRow

Counts a human can verify by counting: ●●●○○.

core
Seismogram

When did things happen, and how hard: event density over time.

core
HeatStrip

How intensity evolved, glanceably: the 1×N sibling of ActivityGrid.

core
DotPlot

A few named values on one scale: minimum ink per comparison.

core
Dumbbell

Where each row started and ended: hollow to filled, no legend.

core
PairedBars

Actual vs expected, category by category: one shared scale.

core
Slope

Who rose and who fell between two moments: crossings read instantly.

core
MicroScatter

Are these two variables related? The relationship no other type tells.

core
SegmentedBar

What is this made of, and in what proportions.

core
HistogramStrip

What does the distribution look like? Mode, spread, skew in a cell.

core
MicroBox

The p50 and spread of a metric: a five-number summary in a row.

core
ProgressRing

How complete is this? At icon size, where a bar doesn't fit.

core
MicroDonut

Roughly what is this made of? An honest, capped concession at icon size.

core
Funnel

Where does the pipeline leak? Stage-to-stage conversion in a cell.

core
LikertStrip

Does the response lean agree or disagree, and how hard.

core
Waterfall

How the deltas compose into the total: P&L in a cell.

core
BumpStrip

Where do we rank, and which way is it moving.

core
DualSparkline

How is this series doing against its benchmark.

core
StackedArea

How the composition is shifting over time.

core
Ohlc

Price action per period: open, high, low, close in a cell.

core
Horizon

A wide-range series folded into a slim, dense band.

core
CalendarStrip

The last few weeks, day by day: real calendar position.

core
EventTimeline

What happened when, and for how long: spans and instants on one row.

core
DecisionTuned to one question.26
CoverageStrip

Can I trust this data, and where was nothing measured?

decision
BenchmarkStrip

Is this value normal for its peer group?

decision
PercentileLadder

What does the tail look like, not just the median?

decision
GradedBand

How sure are we about this one number?

decision
IconArray

How likely is this, really? One rate, made countable.

decision
RateVolume

The rate moved, but on what volume?

decision
NetFlow

In versus out, and where does that leave us net?

decision
RetentionCurve

Do they stay, and does the curve plateau?

decision
BurnChart

Will we finish on time?

decision
ErrorBudget

Are we burning the error budget too fast to survive the window?

decision
ControlStrip

Is the process in control, or did something leave the band?

decision
ForecastCone

Will we land where we need to?

decision
QuantileDots

What are the odds, in countable form?

decision
ABStrips

Did B beat A, and by more than the overlap?

decision
ShiftHistogram

Did the fix actually change the distribution?

decision
ParetoStrip

What should we fix first?

decision
DataDiff

What changed between two versions?

decision
QuadrantDot

Where does it sit in the 2×2?

decision
CyclePlot

What repeats beneath the trend?

decision
ChangePoint

When did the behavior change level?

decision
EnsembleGhosts

What could happen, across the futures?

decision
CohortTriangle

Which vintage retains worst, compared at equal maturity.

decision
StreakSpark

The current run against the record, with the texture of every streak and break.

decision
QueueDepth

Is the backlog draining or growing?

decision
SpreadBand

Which of two series leads, by how much, and since when.

decision
PercentileTrace

Is this entity's standing rising or slipping inside the pack?

decision
ExpressiveUnusual, apt encodings.23
TallyMarks

How many, counted the way a human counts.

expressive
DicePips

A small count or severity, read instantly as a die face.

expressive
FillWord

Progress on a named task, where the label is the bar.

expressive
FatDigits

Which numbers in a dense column are big, before you read them.

expressive
Thermometer

Where a value sits on a calibrated range, and how close to the goal.

expressive
MoonPhase

How far through a cycle or period: readable across cultures.

expressive
Hourglass

How much time is gone and how much remains, both at once.

expressive
BalanceBeam

Which of two sides outweighs, and roughly by how much.

expressive
SproutRow

How mature or healthy is each item in a small set.

expressive
GardenGrid

The rhythm of activity over time: legible in grayscale and print.

expressive
BubbleRow

Roughly how a few magnitudes compare. For precise comparison, use MiniBar.

expressive
MusicStaff

The shape of a short series, read as a melody.

expressive
TreeRings

How growth accumulated, period over period, from the centre out.

expressive
CitySkyline

How groups compare on size, and how activated each is.

expressive
Honeycomb

How many of the available slots are taken.

expressive
Constellation

When the rare events happened, and how big.

expressive
PolarClock

The shape of a day or week cycle.

expressive
SpiralYear

How the year breathed: seasonality at a glance.

expressive
BreathingDot

How loaded the system is right now, ambiently.

expressive
HeartbeatBlip

Is it alive, and how busy? Instantly.

expressive
CometTrail

Where the value is now, and where it has just been.

expressive
OrbitStatus

How slow and how busy is this dependency right now?

expressive
GradeProfile

How hard the route is, and where: pitches coloured by grade, the steepest called out.

expressive
FrontierNewer word-sized forms.23
TimeInRange

How much of the period stayed inside the corridor, and which side it missed on.

frontier
Hypnogram

Which discrete state the system was in over time, and how choppy the transitions were.

frontier
EtaBar

How long this will actually take, given how it has actually been going.

frontier
Waveform

The shape of a high-frequency signal, where its spikes and silences are, at word width.

frontier
EventRaster

When each source fired, and whether sources fire together, in sequence, or not at all.

frontier
RubricStrip

How a thing scored per criterion, with each criterion's weight visible, no fake total.

frontier
TokenConfidence

Which parts of generated text you should double-check: the text is the chart.

frontier
WindBarb

Which way it's flowing and roughly how hard, in one character.

frontier
StarSpoke

An entity's profile across a few metrics, and which one in a set is the odd one out.

frontier
MinimapStrip

Where am I in the whole, and where in the whole is everything else I care about.

frontier
DualWindowMeter

Is the level compliant against its target, right now and on average: spikes vs drift.

frontier
DepthWedge

How much pressure is stacked on each side of the current level, and how wide the gap is.

frontier
PartitionStrip

What the whole is made of, and what the big parts are made of, with parentage visible.

frontier
CalibrationStrip

When a model says 70%, does it happen 70% of the time, and is there enough data to ask.

frontier
ConfusionGrid

Where the errors go: the one thing accuracy-as-a-number hides.

frontier
FoldedDayBand

What a typical period looks like, and whether the current one is typical.

frontier
VolumeProfile

At which level did activity concentrate, not when.

frontier
PhaseTrace

How two coupled signals move together: loops, regimes, and where the system is now.

frontier
TraceFold

Where the latency went: which spans, at which depth, on the path that set the total.

frontier
TapeGauge

The level now, the zone it's in, and how fast it's moving, with the eye parked in one place.

frontier
StationGlyph

A whole weather observation in one character: sky, wind, temperature, dew point, pressure.

frontier
WinProbWorm

Who's winning, and when did the lead flip?

frontier
BiasStrip

Do two ways of measuring the same thing systematically disagree?

frontier
the examples

The same catalog, carrying seven real products — a trading terminal, a print magazine, an eval console.

7 apps · 106 types · 0 dependencies
Browse the examples