Patterns
Real layouts built from the primitives — each in light and dark.
Application shell
The standard chrome — a glass sidebar and top bar over the aurora canvas, with the content area inside.
Data table
A panel with an eyebrow header, a search + filter toolbar, severity cells, status chips, and a row action.
| ID | Severity | Source | Status | |
|---|---|---|---|---|
| F-1042 | Critical | Scanner A | Open | |
| F-1041 | High | Scanner B | Triage | |
| F-1038 | Medium | Manual | Review | |
| F-1031 | Low | Scanner A | Closed |
| ID | Severity | Source | Status | |
|---|---|---|---|---|
| F-1042 | Critical | Scanner A | Open | |
| F-1041 | High | Scanner B | Triage | |
| F-1038 | Medium | Manual | Review | |
| F-1031 | Low | Scanner A | Closed |
KPI strip
A compact metrics row of stat pills above a grid of severity stat cards — the top of a dashboard.
Form
A settings form inside a panel — labelled fields, a select, a textarea, and a right-aligned action row.
Profile settings
Profile settings
Modal & drawer
Confirmation modals and detail drawers over a frosted scrim. Open them to see the spring entrance.
Both dismiss on Escape or scrim-click.
Both dismiss on Escape or scrim-click.
Empty & loading states
Zero states and skeleton loaders — what a surface shows before and without data.
Sign-in card
A centered authentication card with a spectrum keyline, a soft glow, and the field + primary-action stack.
Forgot your password?
Forgot your password?