Bridge itself
100% of styling values and 100% of components come from the design system, up from 9.7% and 52.8% before the move.
Over time
Where components come from
Bridge 895 Show components
Bridge
Button142Link94Badge83TableHead49Icon45
Hard-coded values
1 hard-coded value left, 1 matches a token exactly. How close each value is to a token is explained below.
| Category | Share | Values | Exact | Near | None |
|---|---|---|---|---|---|
| Color | 1 | 1 | 0 | 0 |
-
How adoption is measured Adoption is the share of colors, sizes and components in a product that come from the design system.
Tokens: token uses divided by token uses plus hard-coded values (colors, lengths, radii, shadows, durations, layers, fonts).
Components: Bridge components divided by every UI component in the product: Bridge components, components from other libraries, plain HTML elements that should be Bridge components (buttons, inputs, selects, dialogs, tables, links, images), charts, and local components that look like a Bridge component. Providers do not count.
Hard-coded values: exact means the value equals a token, safe to replace. Near means a token is close (the nearest color as the eye sees it, the nearest step of a scale). None means no token fits: the value may need a new token or a design decision.
Other runs of Bridge itself: Bridge docs site, before (Oct 16, 2026) . Open on GitHub (opens in a new tab)