Every variation of the onboarding screens, rendered from the real design-system components — not redrawn. If it looks like this here, it looks like this in the app.
Haze is not a neutral — it's a desaturated orange at hue 43°. Flame sits 25° away, Sunflower 3°, Spark 29°. So Haze + Flame + Ink is a monochromatic scheme in the literal sense: one hue family plus black. Paper has no hue to compete, so every accent keeps its identity — and every surface gains about 19% contrast against the canvas.
Flame is --action-primary: the one loud CTA per view. Make it the surface and the CTA has nowhere to go — the left phone has a Flame button on a Flame card, which is why 'punchy' reads as heavy rather than energetic. Blue, Sunflower, Pulse, Moss and Paper are all unspoken for, so they can carry a surface and still leave Flame free to mean 'press this'.
Same question, Isaac's point 3. Bare tiles on Haze read as beige with coloured icons; the same tiles on Paper separate, and wrapping them in a colour block gives the screen something to be about. The tiles were always coloured — they just had nothing to be coloured against.
The same step on all nine surfaces. One component set; the surface colour is the only variable. Text pairing is automatic — white only on Blue and Ink.
Which accent the chosen row keys off. The fill is an opaque tint — a translucent one would pick up the block colour underneath. The mark inside the control is per-accent: white clears 3:1 on Flame, Blue and Moss, but Sunflower, Pulse and Spark take Ink.
Dot reads as 'one of these'; check reads as 'confirmed'. Both carry a shape change as well as colour, so the state survives greyscale.
Same tone, same content; only the decoration changes. The colour block does the work in all four. D is the reference-frame density, which at real card size means every mark is a clipped sliver.
One box per digit. A filled box tints, so progress is visible without counting. Invalid pairs Flame borders with a message — never colour alone.
A chosen pill fills solid and gains a check — two signals, so selection survives colour-blindness and greyscale. At the cap the unchosen pills disable rather than silently no-op.
One component, two variants, same props — so the copy can't drift between them. The dots carry the label as their accessible name; previously they announced nothing at all.
The block stays a card: the outline and offset shadow are the brand signature. What reads as oversized is the chrome, not the colour. Tuned pulls the gutter to 14px, padding to 20px and the shadow to 5px — worth 20px of row width (294 → 314).
Available marks. Blob is the original; the rest were added for this art direction. Density in-product is still undecided.