Status
Domain-named because the data layer uses those terms. The dot + tinted ground reads consistently across cap-table rows, document lists, and signing flows.
Status pills — rendered
SignedPendingDraftFiled
App · status palette
| Class | Dot | Text |
|---|---|---|
.status-signed | #3FBF6E | #1b7a47 |
.status-pending | #E8A845 | #8a5e1c |
.status-draft | var(--fg-soft) | var(--fg-muted) |
.status-filed | #6E8AD8 | #3a5cb8 |
The dot uses the lighter variant (--status-*-dot); the text uses the deeper variant (--status-*-text). Different roles — they never need to match.
HTTP method badges — rendered
GETPOSTPUTPATCHDELETE
PUT and PATCH share the same orange (idempotent vs partial — same family, same tint). Apply via .method-badge.m-{get,post,put,patch,delete}:
| Class | Color | Background |
|---|---|---|
.m-get | #2A6FDB | 10% bg |
.m-post | #1F8A5B | 10% bg |
.m-put | #B45A1A | canonical |
.m-patch | #B45A1A | same as PUT |
.m-delete | #B0322B | 10% bg |
Map a real lifecycle state to one of these tokens —
signed, pending, draft, filed.Don't rename to generic
success / warning / info. The data layer uses domain terms; the design layer follows.