Design-system knowledge, compiled into contracts agents can use.

Aiko is a Semantic Design System Control Plane. It compiles what your design system already knows into small contracts any AI agent can build from, then checks the result against them.

Apply for Early Access See how it works

Supported surfaces

  • React
  • Angular
  • Web Components
  • Figma
  • Penpot
  • Tailwind
  • Design Tools
  • Documentation
  • Component Code
  • Design Tokens

Loading semantic graph.

Your team already encoded the knowledge.

A design system is far more than a component library. It holds years of decisions about interaction, accessibility, behaviour and implementation, made by designers, engineers and accessibility specialists.

Those decisions live in Figma files, component code, Storybook stories, tokens, documentation and the conversations around them. People connect the pieces without thinking.

An AI agent sees only the files it happens to open.

The challenge is not writing more documentation. It is giving agents what your team already knows, without losing its meaning.

Component Code Button.tsx 
export function Button({
  intent = "primary",
  disabled,
  ...props
}) {
  return <button data-intent={intent} />
}
Accessibility Accessibility.md

Dialog focus must return to the invoking trigger after dismissal.

Tokens tokens.json
space.300
12px
radius.md
6px
motion.ease
cubic
Design Tool Figma Component

Dialog / Modal / Default

Storybook Dialog.stories.tsx
  • Default
  • Nested focus
  • Dismissal blocked
Design Decision ADR-014

Outside click does not dismiss destructive confirmation flows.

Pull Request #4821

Align Angular and React dialog escape behaviour.

Knowledge becomes structure.

Everything your team creates already has relationships. Components depend on behaviours, behaviours answer to accessibility rules, states follow interaction patterns, and tokens shape the implementation.

Today those relationships are scattered across tools and formats. Aiko connects them into one Canonical Design Graph and keeps the evidence behind every link.

People and agents then navigate the same structure, instead of each interpreting a different file.

Not another source of truth. A semantic layer over the sources you already trust.

Loading semantic graph.

Only the neighbourhood you need.

No agent needs your entire design system. It needs the part that matters for the task in front of it.

Ask for a dialog, and Aiko projects its neighbourhood from the graph: the behaviours, states, accessibility expectations and resources that apply, packaged as a contract the agent builds from instead of searching.

The graph stays complete. The prompt stays small.

Same agent. Smaller context. Stronger contracts.

Loading scoped neighbourhood.

Context Bundle dialog.contract
Component
Dialog
Projection
6 nodes / 11 relationships
Behaviours
  • Focus Restoration
  • Overlay Dismissal
  • Escape Handling
States
  • Open
  • Modal
Resources
  • Typography
  • Motion
  • Spacing
Evidence
  • Accessibility
  • Interaction Spec
  • Component API

Send it to your favourite AI agent

Trust requires evidence.

Generating an interface is only half the job. The harder question is whether it still matches the intent your team established.

Aiko compares the generated work with the contract the agent received, and with the design, code and documentation behind it.

Not another AI opinion. Evidence.

When something drifts, Aiko shows exactly where the implementation diverges and which source established the expected behaviour.

Verification Snapshot

87% Contracts pass
124
Pass
13
Drift
5
Not checked

Expected from contract

Focus restored to trigger

Drift

Observed implementation

Focus lost to document body

Evidence cross-discipline
Figma Component

Dialog / v12

Variant

Modal / Default

Modal
Dismissible
Size
Large
Interaction Spec

Focus restoration

onDismiss() { restoreFocus(trigger) }
Component Code

Dialog.tsx

return (<DialogContent>...</DialogContent>)
Accessibility

WCAG 2.4.3 · 2.4.7 · APG Dialog

  • Focus order
  • Focus visible
  • Focus trapped
  • Focus restored
Design Tokens

motion.ease.out / 160ms

radius.modal = 12px

Contracts capture intent. Verification preserves trust.

Drift becomes explainable. Aiko shows what changed and why.

One graph. Every surface.

Frameworks change.

Design tools evolve.

AI platforms come and go.

Your design system should not be rebuilt every time the ecosystem shifts.

The graph keeps intent stable while each surface receives the representation it needs: React, Angular, SwiftUI, Web Components, Figma, Penpot, Storybook, Zeroheight, Confluence, DTCG tokens or CSS.

One source of intent. Many projections.

Canonical Design Graph
  • React
  • Angular
  • Web Components
  • SwiftUI
  • Figma
  • Penpot
  • Storybook
  • Zeroheight
  • Confluence
  • DTCG
  • CSS

Your team already built the knowledge.

Now make it usable by AI.

Apply for Early Access