Design tools for systems thinkers.
Where human perception meets mathematical rigor.
Building with AI? Use the MCP server and let your agent generate the system.
Generate perceptually uniform color palettes in OKLCH. Primitive & semantic tokens, shadows, dark mode — ready for shadcn/ui.
Build fluid typographic scales with clamp(), golden ratio or custom ratios, and live Fontshare font preview.
Shadows, borders, radii, glass effects, and focus rings — export as CSS custom properties.
Find icon sets that match your brand personality — get sizing tokens and export recommendations.
Spacing scales, breakpoints, container widths, and aspect ratios — production-ready layout tokens.
Behavior is platform truth — explore how states map to your tokens, and export the grammar file for AI agents.
Easing curves, durations, and transitions — production-ready motion tokens for CSS, Framer Motion, and Tailwind.
Combine colors and typography into one design system. Start with Colors, then Type — get a single, unified export.