System map
Infographic
One measured drawing of the whole system: a single design source, the compile step, 5 platform outputs, and the 5 component libraries that resolve to them. Numbers are read from the build, not hand-typed — including these two, which said “four component libraries” for as long as Angular had existed.
443
design tokens
primitives + semantic, DTCG
98
React components
7 categories
37
chart recipes
Recharts, token-driven
5
platform outputs
Web CSS · tokens.ts · SwiftUI · Compose · Flutter
100%
WCAG AA
text pairs, light + dark, CI-gated
5
component libraries
React · Angular · SwiftUI · Compose · Flutter
[01]
DTCG source
tokens/**
[02]
Style Dictionary v4
pnpm build:tokens
[03]
Platform output
dist/{web,ios,android,flutter}
| Capability | React | Angular | SwiftUI | Compose | Flutter |
|---|---|---|---|---|---|
| Component surface | ● | ◐ | ◐ | ◐ | |
| Design-token contract | ● | ● | ● | ● | |
| Light + dark | ● | ● | ● | ● | |
| Type scale wired | ● | ● | ● | ● | |
| CI build check | ● | ● | ● | ● | |
| Published package | ● | ◐ | ◐ | ◐ |
Of the 98 React components, SwiftUI ports 90, Jetpack Compose 90 and Flutter 90; the rest (Form, Navigation Menu, Combobox and a couple of platform-specific gaps) stay React-only, with parity snippets for all of them. Every port rides the same token contract.
v0.1.0
First public release.
v0.2.0
Rebrand to KinetixUI.
v0.3.0
CLI list + add --all; Jetpack Compose library.
v0.4.0
Four-platform component parity.
v0.5.0
Action-blue primary set per theme; component gallery and infographic overhaul.
v0.6.0
New AppBar component — a web application top bar.
v0.6.1
Publishes carry npm provenance.
v0.6.4
React 19 toolchain and dependency upgrade.
v0.7.0
Motion, opacity and z-index tokens; asChild on Badge and Tag.
v0.8.0
Empty and Kbd.
v0.9.0
ButtonGroup and NativeSelect.
v0.10.0
Banner, DescriptionList, SegmentedControl and Timeline.
v0.11.0
ComparisonSlider, Marquee and PageHeader.
v0.12.0
Twelve advanced components, the largest component release so far.
v0.13.0
Inspect, Doctor, interaction tokens and the first RTL support.
v0.14.0
Cross-platform inspection from the CLI: `kinetixui parity`.
v0.15.0
Theme tooling: `theme create` and `theme build`.
v0.16.0
Design-system linting: `kinetixui lint`.
v0.16.1
CLI reliability and security hardening for the commands added since 0.13.
v0.17.0
Accessibility hardening for the hand-built widgets, contrast fixes, and a richer `inspect`.
v0.18.0
Role tokens (action, link, focus, brand), a keyboard-navigable DataGrid, and the accessibility baseline closed out.
v0.19.0
DataGrid range selection with copy, opt-in.
v0.20.0
DataGrid drag-select and separate selection ranges; the native Buttons show hover and pressed states.
v0.20.1
The light warning focus ring now clears WCAG 1.4.11, and CI checks every focus ring.
v0.21.0
DataGrid selects whole columns and rows, and scrolls while you drag-select.
v0.22.0
The spatial grid is documented and extended, radius gets role aliases, and the native ports gain the same spacing and radius constants.
v0.23.0
A Create preset becomes a real theme file — web CSS, SwiftUI, Compose or Flutter — from one shared engine. Eleven components reach Stable, every component's React API is documented, and Angular arrives as a preview implementation, versioned here but not yet on npm.
| Capability | KinetixUI | shadcn/ui | Radix Themes | MUI |
|---|---|---|---|---|
| One design source → many platforms | ● | ○ | ○ | ○ |
| DTCG token pipeline (Style Dictionary) | ● | ○ | ○ | ○ |
| Copy-in via CLI registry (you own the code) | ● | ● | ○ | ○ |
| Contrast audited in CI | ● | ○ | ○ | ○ |
| Light + dark token sets | ● | ● | ● | ● |
| Native mobile libraries | ● | ○ | ○ | ○ |