Quietly beautiful. Quietly engineered.
A React 19 + Tailwind v4 design system that doesn't shout. Token-driven, three themes, a framework-agnostic adapter — every detail considered, none of them loud.
React 19
Tailwind v4
Apache-2.0
Framework-agnostic
npm v0.2.14license Apache-2.0
0+
Components + patterns
0
Tests, all green
0
Built-in themes
0
Subpath entry points
Quick start
See it in code
Install the package, import a component, theme it with tokens. The same CodeBlock you see here is a YunUI pattern.
1 Why YunUI
Care, in the details.
Not the most components — the most considered ones.
41+ components + patterns
Primitives, page-level patterns, and AI product components — composed, typed, and quietly ready.
3 themes (light / dark / OLED)
Token-driven theming. Light, zinc-dark, and a true-black OLED theme — swap with one class.
Framework-agnostic adapters
Bring your own Link, Image, and i18n. Inject them once; the library stays portable across apps.
Tokenless OIDC releases
Published to npm via trusted publishing with provenance — no long-lived tokens in CI.
141 tests, typed, JSDoc'd
Strict TypeScript, JSDoc on the public surface, and a test suite that guards every primitive.
In production at Yunxin
Quietly running in a real, shipping app — Yunxin, end to end.
Theming, live
Theming, live
Real YunUI components — flip the theme switch (top-right) to see light, zinc-dark, and true-black update in place.
Pro planActive
Everything in Basic, plus higher limits and priority support.
DefaultInfoWarningError
FAQ
Questions, answered
The things people ask before adopting YunUI in a real project.
Everything is driven by CSS custom-property tokens. Import the stylesheet, then toggle a theme class (light / dark / true-black) on the root html element. Override any token in your own CSS and every component follows — no prop drilling, no theme objects to thread through the tree.
No. The core primitives are framework-agnostic. Routing, image, and i18n concerns are injected through a thin adapter layer (YunUIProvider) — wire in Next's Link/Image or your own, and the library stays portable across apps.
Changes live in one library, versioned and pulled in through npm. Releases are published with provenance via tokenless OIDC trusted publishing — no long-lived secrets in CI.
Interactive primitives build on Radix-style behaviors with keyboard navigation, focus management, and ARIA wired in. Components ship typed and JSDoc'd, and a 141-case test suite guards the public surface.
Get started
Built quietly. Ready when you are.
Browse the gallery, read the docs, or jump straight into the source on GitHub.