All dashboard templates / Learn
Learn23 Jul 2026 · 6 min read
What is a KPI card, and what makes one readable?
A KPI card is a small panel that presents one key performance indicator: a label, a current value, a comparison against a target or prior period, and often a sparkline. It is the fastest-read element on a dashboard, and the one most often designed badly.
KPI cards sit at the top of nearly every dashboard because they answer the first question: what is the headline number right now? The reader's eye lands on the cards before any chart, judges the state of the system in about two seconds, and only then drops into the panels below for explanation. A dashboard whose cards lie, clutter, or confuse fails before its charts get a chance to help.
What are the parts of a KPI card?
A complete KPI card has five parts, and each part has one job. Cards that skip parts force the reader to reconstruct context; cards that add parts beyond these five stop being cards and start being panels.
| Element | Job | Design rule |
|---|---|---|
| Label | Names the metric so the value means something | Plain business vocabulary, smallest text on the card, sentence case |
| Value | Gives the current number | Largest text on the card; formatted with units and separators ($41.2K, 1,208) |
| Comparison | Says whether the value is good | Delta against a named baseline: vs last month, vs target, vs plan |
| Sparkline | Shows recent direction without a full chart | 7 to 30 points, no axis chrome, same width as the card |
| Status cue | Flags urgency at a glance | One accent color for the delta; reserve red for genuine bad news |
Open Vault, the free finance template, and the anatomy is visible: the cards read Total income, Total expenses, and Net profit, each with its value in the largest type on the card and a delta beneath it. The reader learns the month's financial position from three cards in one glance, then scrolls to Income vs expenses for the explanation. That sequence, card then chart, is the reading contract a KPI row makes with its audience.
Why does the comparison matter more than the value?
A value without a comparison is trivia, because no number is inherently good or bad. Revenue of $120,000 is triumph for one team and a missed quarter for another. The comparison is what turns data into information: plus 8% against last month, 92% of target, $12K under plan. The delta line carries the meaning; the big number carries the magnitude.
Two rules keep the comparison honest. First, name the baseline. "Up 8%" invites the question "against what", and a card that invites questions has failed. Write "vs May" or "of $130K target". Second, match the baseline to the metric's rhythm. Month-over-month suits revenue; week-over-week suits signups; year-over-year suits seasonal businesses where last month is the wrong referee.
The big number carries the magnitude. The small line under it carries the meaning.
What makes a KPI card readable?
Readability comes from hierarchy, formatting, and restraint, in that order. Hierarchy means the value dominates: if the label and the value compete for attention, the card is doing typography instead of communication. Formatting means the number arrives pre-digested: thousands separators, sensible precision, currency symbols, and units spelled out where the value is abbreviated. $41.2K reads faster than $41208.00, and 99.95% uptime reads better than 0.9995.
Restraint is the hardest rule. One number per card. A card showing revenue, growth, target attainment, and a forecast is four cards compressed into one, and the reader must decompress it every visit. The same discipline applies to color: one accent for the delta, everything else neutral. A card row where every delta is red and green is a traffic light farm, and readers stop trusting color that appears everywhere.
The sparkline deserves its own caution. Its job is direction, not precision, so strip the axes and gridlines. But keep the scale honest across a row of cards: if four sparklines share a row, they should share a scale logic, or the reader will compare shapes that mean different things.
How many KPI cards should a dashboard show?
Three to six cards per view is the working range, and the count should equal the number of questions the reader asks first. A founder checking a SaaS dashboard asks about MRR, growth, churn, and cash: four cards. A finance operator asks about income, expenses, and net: three cards, which is exactly what Vault renders. Twelve cards is not a KPI row; it is a second dashboard hiding at the top of the first one.
When a template ships more cards than you need, delete rather than shrink. Shrinking the cards to fit twelve destroys the hierarchy that makes any of them readable. Deleting nine keeps the three that answer the standing questions, and the deleted metrics usually belong in a chart or table further down the page anyway.
Where can you study real KPI cards?
The live previews in the dashboard template catalogue are the quickest field study. Compare the three-card finance row in Vault against the revenue screens in Crest and the metric headers in Northstar: same anatomy, different vocabularies, because the cards answer each seat's own first questions. Six templates, including Vault, are free on the free templates page, and the rest are $6.99 each.
Browse all dashboard templates → · Free templates · Notes on choosing and using dashboard templates