Hanzo GUI
One UI kit. Every platform.
The cross-platform UI kit and design system that powers every Hanzo surface — web, mobile, desktop. Tokens, primitives, and motion that ship the same code everywhere.
Build it once. Ship it everywhere.
The same code that runs your web app runs your iOS app. No bridges, no compromise.
One Codebase, Every Surface
Write your UI once. Render it natively on iOS, Android, web, and desktop. Same components, same props, same behavior.
Design Tokens, Not CSS
Color, spacing, typography, motion — all centralized as tokens. White-label by org, theme by feature, all without forking.
Compile-Time CSS
Styles flatten to atomic CSS at build time. Zero runtime cost on the web, zero style recalc on native.
Composable Primitives
Stack, XStack, YStack, Text, Button, Sheet, and Dialog — primitives that compose into anything without leaking abstraction.
Animated by Default
Spring-driven animations on every prop. No extra library, no boilerplate — just declare the target state and ship.
Type-Safe Theming
Every token is typed. TypeScript catches design-system drift before it lands in production.
Drop it in. Start shipping.
One install gets you the whole kit.
# Install
pnpm add @hanzo/gui
# Use it
import { YStack, Button, Text } from '@hanzo/gui'
export function Welcome() {
return (
<YStack space="$4" padding="$4">
<Text size="$8">Hello, Hanzo</Text>
<Button>Get started</Button>
</YStack>
)
}The design system that ships your product
Powered every Hanzo surface in production. Battle-tested across web, native, and desktop.