Synapse UI
A sellable Figma UI kit for the people building AI products. Synapse UI packages the interface patterns that general-purpose kits skip chat, streaming, agent steps, tool calls into one polished, token-driven system in light and dark.
A UI kit built for AI apps
Synapse UI is a commercial Figma kit aimed at designers and developers shipping AI products chat apps, agent interfaces, and AI features bolted onto existing tools. Instead of another generic component library, it focuses on the patterns AI products actually need, so buyers start from a real foundation rather than rebuilding the basics.
One token layer, light and dark
Every color, space, and radius is a Figma variable, not a hard-coded value. A semantic layer sits on top of raw primitives, so light and dark themes come from a single source of truth. Type, spacing, and effect styles are defined once and reused everywhere the same discipline a production design system needs.
var(--color-bg-canvas)),
so the design tokens read the same in Figma and in code.
Composed, never redrawn
The AI components are assembled from the same base primitives buttons, inputs, surfaces rather than drawn from scratch. That keeps the streaming message, the agent step list, and the prompt bar visually consistent with the rest of the kit, and makes the whole system easy to extend as new AI patterns emerge.
Maps 1:1 to the code
Synapse UI is named and structured to mirror how developers actually build: tokens map to Tailwind, and component names follow shadcn conventions. The payoff is concrete an AI coding tool can reference the existing system instead of regenerating it, saving both time and AI-coding credits on every screen.
Need a production-ready design system or UI kit?
Book a free 20–30 minute call to discuss your design system, component library, or product UI.