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.

Browse components Read the docs

React 19

Tailwind v4

Apache-2.0

Framework-agnostic

npm v0.2.17license Apache-2.0

Components + patterns

Tests, all green

Built-in themes

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.

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.

Used by

Powering real products.

YunUI was extracted from Yunxin and now ships across YuhuanStudio's products — every screen you see runs on these components.

YunxinLive

Unified LLM API gateway — 24+ providers behind one API key.

Visit

YunshuOpen source

Local multimodal inference engine for Apple Silicon — native speech-to-speech, all on-device.

Code

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.

Browse components Read the docs GitHub