Blocks
Ready-made arrangements of components, such as a strip of stats or a list of bars. Each page draws its examples with the real components and gives their code to copy into your project.
Agent cardOne agent's job at a glance: its state in words, how far along it is, and the one thing to do next.
Bar listA ranked list of names and figures, each over a bar that shows its share.
Diagram nodeOne box of a how-it-works diagram: its kind, its name and what it does, with the dots its arrows meet.
File treeA project's files in a panel, with the line it shows, a count of changes and when it was read.
Goal rowA goal's title and count over a bar of how much is done, with a line of details and its status in words.
Price cardOne plan at a glance: its name, its price, what it includes and the button that chooses it.
Project cardOne project at a glance: its stage in words, three figures, its recent work and how many places are taken.
Quote cardWhat a customer said, in their own words, under a quotation mark, with who said it.
Settings panelA column of settings beside what they change: a choice at the top, groups that open and close, and a footer to count and reset changes.
Site cardOne site at a glance: whether it answers, in words, the version it shows, its last thirty days and three figures.
Stat stripA row of stats in one frame, or none, that wraps to fewer columns as its space narrows.
Usage meterHow much of an allowance is used, as short meters with their values and when it starts again, in a toolbar or stacked.