Layer 4 · Industry Systems
Banking
Banking components compose Layer 2 primitives into financial-domain surfaces — transaction lists, account summaries, and spending overviews.
What this industry contains
The first Layer 4 Industry Systems pilot (2026-07-25). Every Banking component is a composition of existing Layer 2 components (List Item, Avatar, Badge, Popover, Card, Tag, Button, Line Chart, Bar Chart, Tabs, Skeleton) — never a fork or duplicate. No industry-specific tokens exist; all styling aliases existing Foundation/Semantic tokens.
Status
Banking Transaction Row, Banking Account Card, and Banking Balance Summary are implemented in Beta. Figma parity is pending for all three — confirmed via a full Figma file search that no Industry Systems reference exists yet, not an oversight.
Accessibility considerations
Banking components inherit their accessibility model entirely from the Layer 2 primitives they compose — no separate accessibility surface of their own.
Implemented components (3)
- Banking Transaction Rowbeta
Banking Transaction Row is a single financial transaction entry — merchant, date, amount, and status — with a Popover for full transaction detail.
- Banking Account Cardbeta
Banking Account Card is a summary card for one financial account — account type, current balance, a compact balance-history sparkline, and an action button.
- Banking Balance Summarybeta
Banking Balance Summary is a spending/income overview card with a time-range-filtered Bar Chart and a loading state.