Loading
Loading
One reference so every page, prototype, and deck feels like the same product. Use these tokens and the shared components, do not reinvent them. This is the one page where showing raw token values is the point.
The bright accents above are decorative: use them for dots, fills, and borders. For status text on paper, use the darker "ink" variants. They keep the same hue but clear WCAG AA (4.5:1 for small text).
Bob answers on chat, web, and email, asks the right questions, and prepares an indicative estimate in minutes. A licensed adviser confirms and binds, then Bob serves the policy for life.
Both radius knobs are 4px, so nothing is softer than a 4px corner except fully-round pills. Bump the two tokens to soften the whole system at once.
The raised hero-card lift. One token, used across every surface.
The floating lift for menus and dropdowns.
Motion is decorative. It signals presence and thinking, and it is always optional.
These are the actual shared components pages are built from, rendered here with illustrative sample content. The people and figures are from the golden-thread cast (Dana and Ava Chen at Northwind), clearly illustrative, and nothing calls a backend.
A customer messages the firm. Bob answers in the firm's brand and discloses it is AI.
Any channel
Bob itemises an indicative estimate, each line with a reason and a confidence level.
Every line explained
One of the firm's advisers reviews, adjusts if needed, and binds under the FAP. Bob never binds.
A human is accountable
Reason codes and cited sources are recorded end to end, ready for the FMA.
On the record
| A general chatbot | Bob | The old way | |
|---|---|---|---|
| Answers in your brand on web, chat, and email | No | Yes | Office hours only |
| Itemised, indicative estimate you can explain | No | Yes | By hand, slower |
| A licensed adviser reviews and binds | No | Yes | Yes |
| Every decision logged for audit | No | Yes | Manual |
| Binds the policy | No | No, hands to a licensed human | Yes, the adviser |
Bob's estimates are clearly labelled indicative: prepared by AI, not a bound policy and not final advice. A licensed adviser confirms the numbers and binds under the firm's FAP. Bob never binds.
No. Use the tokens on this page. One-off hex colours and magic-number spacing drift out of sync and break the shared look. If a token is genuinely missing, add it to the system rather than inlining a value.