AI Design Control Layer

Your Design System, Always in Sync

Every AI tool generates UI differently. AIUI ensures your tokens, components, and design rules are followed in every conversation -- so your product stays consistent no matter who (or what) builds it.

Get Started FreeSee How It Works
Terminal
$ claude mcp add aiui

One command. That's it. Your design system is now connected.

Works with Claude
Works with Cursor
Works with Windsurf
Works with VS Code
360+
Design tokens
142
Component recipes
14
Style packs
12
MCP tools

Features

Everything you need to control AI-generated UI

From design tokens to full component recipes, AIUI gives Claude the context it needs to build UI your way.

Style Packs

14 curated design systems with 360+ tokens covering colors, typography, spacing, shadows, and radii.

Component Recipes

142 code templates with props, variants, and AI usage rules that Claude follows precisely.

Design Memory

Persistent .aiui/ files Claude reads every conversation, so your design decisions stick across sessions.

Token Compliance

Validates generated code against your approved tokens. Catches style drift before it reaches production.

Visual Studio

Pick your style pack and components in one guided flow. Preview tokens and export your config instantly.

Quick Setup

Get your API key, paste one config block, and start building. CLI-free onboarding in under 60 seconds.

How It Works

Up and running in 3 steps

No packages to install. No build plugins to configure. Just your design decisions, delivered to Claude.

1

Define your design system

Import your tokens, pick a style pack, or build from scratch in the visual studio. No credit card required.

Colors, typography, spacing, components, and rules -- all in one place.

2

Connect your IDE

One command connects Claude, Cursor, or VS Code to your design system. Setup takes under a minute.

Works with any MCP-compatible AI tool, automatically stays in sync.

$ claude mcp add aiui
3

Ship consistent UIs

Every AI-generated component follows your tokens, patterns, and rules. Your product stays on-brand across every screen.

Design decisions persist across all sessions and team members.

The Difference

Design consistency, automatically

Without AIUI, Claude invents styles on the fly. With AIUI, every component follows your exact design system.

Without AIUI

Inconsistent styles, inline CSS, arbitrary colors, no design tokens.

// Prompt: "Build me a settings page"

<div style={{ padding: 20 }}>
  <h1 style={{ fontSize: 24, color: "navy" }}>
    Settings
  </h1>
  <button style={{
    background: "cornflowerblue",
    padding: "8px 16px",
    borderRadius: 4,
  }}>
    Save Changes
  </button>
</div>
With AIUI

Your exact tokens, approved components, consistent output every time.

// Prompt: "Build me a settings page"

<div className="p-6 space-y-6">
  <h1 className="text-heading-lg font-semibold
    text-gray-900">
    Settings
  </h1>
  <Button
    variant="primary"
    size="md"
    className="bg-primary-600 rounded-radius-lg
      shadow-shadow-sm"
  >
    Save Changes
  </Button>
</div>

Early Access Beta

AIUI is in active development. Join the beta to shape the future of AI-driven design systems. Free during beta — no credit card required.

Join the Beta

Currently supporting Claude Code, Cursor, Windsurf, and VS Code

Help Us Build Better

We ship based on what you tell us. Found a bug? Have a feature idea? Your feedback directly shapes the roadmap.

Report a Bug

Something broken or not working as expected? Let us know and we will fix it fast.

bugs@aiui.store

Request a Feature

Have an idea that would make AIUI better? We prioritize features based on user requests.

features@aiui.store

Get in Touch

Email

hello@aiui.store

Twitter / X

@aiikistore

Discord

Coming Soon