Promise list
Three facts about what this product does with a person's money, each one a short heading and a sentence, each one marked by a rule down its left side. It is GC6 in the block bank, and it is the block that has to be believed before a bank gets connected.
Anatomy
Two content slots per item, which is what makes it a molecule; it hosts no atom at all, so nothing here is positioning something that belongs to another file. Everything below is drawn by design/system/components/promise-list.css through the same entry point a product screen loads.
- What Tendd can seeThe charges that repeat on your account, and nothing else you do with your money.
- What Tendd can never doRead-only. Tendd cannot move your money.
- What you can undoDisconnect at any time, and your bank data goes with it.
.promisesthe block. Bullets and the browser's indent are taken off, because these are three claims and not three items in an inventory.promises lione claim. The heading and the sentence are one element with one border, so the rule spans both and marks the pair rather than the lineborder-left3px, reading--line-container. A BORDER WIDTH, not a spacing: the founder's review folded margins, paddings and gaps onto an 8px grid and left border widths exactly where they were, so 3 stays 3li strongthe claim in three or four words, set todisplay: blockso the sentence starts a line under it. It steps up an ink tier and gains weight, and it does not gain size- the sentence the li's own text, in
--text-body. There is no wrapper around it, which is whystronghas to be a block for the pair to read as a pair
Behaviour at width
A reading measure and no query at all: --container-text, 52ch, added at stage 10. A promise is a claim of two lines, which is prose rather than an inventory row, and it had no measure. The width sweep found the three items on settings-no-account running 620px, 72 characters to a line, at a 1600 window, because the column they stand in is 620 and nothing narrower held them. The rule on the left does not move: it is the left edge of the box, and only the right end changes. At 360 nothing changes at all, because the column is already narrower than the measure. See Width.
Variants and sizes
One form and no axes. The inventory records none and the stylesheet declares none: one rule width, one ink pair, one size, and all three pages render the same thing. There is no matrix to draw here, and drawing an empty one would suggest variants are missing rather than unnecessary.
What is worth putting side by side is the same component on its three screens, because it changes its subject completely while changing nothing about its form. That is the argument for it being one component rather than three blocks that look alike.
| Screen | What it claims | Why it is there |
|---|---|---|
| Connect your bank | What Tendd can see / What Tendd can never do / What you can undo | Directly above the button that opens Plaid. The audience is skeptical about connecting a bank by definition, so the three lines answer the three questions in the order they are asked |
| Data and privacy | We read your recurring charges / We can never move your money / We do not sell your data | The same three claims restated as the page's whole content, for somebody who came looking for them rather than meeting them on the way past |
| Settings, no account | Your list follows you / What we tell you about can reach you / What we would hold | A different subject entirely, an account rather than a bank, and the same form: what you gain, what changes, what we would hold |
The rule is hairline and stays hairline, and that is the decision this component exists to hold. It reads --line-container, the same value the edge of a card takes: decorative, owing no contrast threshold, because nothing here has to be found by touch. Petrol was rejected by name in kit.css. Three accent bars beside a primary button is four petrol objects on one screen, and the One Voice Rule allows the accent exactly three jobs: the primary action, the current selection, and the trust line's shield. A promise is none of the three. The block already carries the shield if it needs one, and the bars are structure.
A fourth implementation existed for one day and no longer does. The landing carried the four trust claims as this list, in its own lp- namespace, with the same 3px rule and the same 14px inset. On 2026-08-15 the founder replaced that block: each claim now stands in its own panel beside the object that settles it, which is landing facts. So this component stands on three screens and no fourth, in both corpora, and the copy of it that the inventory used to name is gone rather than folded in.
When to use it
A promise list is the product saying what it will and will not do, before it is asked to do it. It stands at exactly the moments where trust is the thing being spent: above the Connect your bank button, as the whole of the Data and privacy screen, and directly under the "Send a sign-in link" action on Settings, where the thing being asked for is an email and the thing being offered is a list that stops living in one browser. All three are places where somebody who is skeptical by disposition has to hand something over.
The shape is fixed because the job is fixed. Three claims, no more: two reads as an incomplete answer, four reads as a legal notice, and the third design principle says plain money language and the fourth says say what happens with the data, every time. Each claim is three or four words that could be a question a person actually asks, and the sentence under it answers that question and stops. "What Tendd can never do" then "Read-only. Tendd cannot move your money." Nothing in the block hedges, and nothing in it is longer than two lines on a phone.
It reads at one size throughout, which is what keeps three claims looking like one calm block rather than three sub-headings on a page that already has a heading. The heading slot gains ink and weight, not size. That is the same restraint the Two Tiers Rule asks for one step up: emphasis by tier, never by scale.
The rule, and the anti-rule
- We do not sell your dataNot to advertisers, not to anyone, on any plan.
The heading is the promise in the person's own words and the sentence closes every door the promise leaves open. "On any plan" is doing real work there: it answers the question the reader was about to ask, which is whether the free tier is the product.
- Charged to
- Chase checking
- Category
- Music
A label and a value about the person's own data is a pair list, divided by hairlines. The two blocks look similar and mean opposite things: a promise is a claim the product makes about itself and is read once before a decision; a pair is a record about the person and is read every time they come back. The rule down the side is the mark of a claim, the hairline between the lines is the mark of a record.
- Your list follows youRight now it lives in this browser only. Clear it, or open Tendd on your phone, and the list is not there.
- What we tell you about can reach youA price change or a payment that did not go through can be sent to you, instead of waiting here until you look.
- What we would holdAn email and a currency. Nothing is read from a bank, because you have not connected one.
Settings with no account, and the subject is not the bank at all. Same three-claim shape, same rule, same size: what you gain, what changes, what we would hold. That the form carries a different subject without a single change is the reason this is one component.
The same guarantee restated at the FOOT of a working screen, small and quiet under a hairline with a petrol shield beside it, is a trust block. It stands on 11 grey pages because it is a reminder rather than an argument. Reach for the promise list where a decision is being asked for, and the trust block where one has already been made.
States
None, and it was checked rather than assumed. A promise is a statement and never a target: a sweep of every .promises list on all 57 grey pages and all 57 coloured ones returns zero anchors inside one, 3 lists on each side. What follows the block on Connect your bank is an action row, a sibling and not a child, and that separation is the reason three claims read as a statement rather than as a menu. Drawing four empty cells would document something the product cannot do.
The technical half
| Reads | Which token | Growing from |
|---|---|---|
| the claim | --text-primary | --ink. 17.4:1 on the light surface, 15.0:1 on the dark one |
| the sentence | --text-body | --slate. 10.2:1 light, 10.4:1 dark |
| the left rule | --line-container | --hairline. Decorative at 1.23:1 light and 1.33:1 dark, and raising it was rejected on 2026-08-11 because it outlines the whole product |
| both slots | --type-body | 14px. Was 13.5, folded by the founder's review of 2026-08-11. One size throughout, on purpose |
| the gaps | --space-24, --space-16, --space-2 | the 8px grid. The block's 22 goes to 24, the gap between claims goes 12 to 16, the inset from the rule goes 14 to 16 |
| the rule's width | literal | 3px. A border width, explicitly outside both scales: rounding it to 4 would be this file inventing a decision the founder's review did not take |
Lives in design/system/components/promise-list.css. Stands on 3 grey pages (connect-bank, data-privacy, settings-no-account) and 1 coloured one: Settings, no account. The other two screens are still grey, which is why the block's own inventory row was written from the grey rather than from a colour sample.
<ul class="promises">
<li><strong>What Tendd can see</strong>The charges that repeat on your account, and nothing else you do with your money.</li>
<li><strong>What Tendd can never do</strong>Read-only. Tendd cannot move your money.</li>
<li><strong>What you can undo</strong>Disconnect at any time, and your bank data goes with it.</li>
</ul>