memoire
The memoire server provides a comprehensive suite of tools for design system management, Figma integration, code generation, and AI-powered analysis.
Figma Integration: Pull design systems (tokens, components, styles) from a connected Figma file, capture screenshots, inspect selected nodes, browse the file tree, and execute arbitrary JavaScript via the Figma Plugin API.
Spec Management: List, create, retrieve, and validate component, page, and dataviz specs with Zod schema validation.
Code Generation: Generate shadcn/ui + Tailwind component code (React/Vue/Svelte) from saved specs, organized by atomic design level.
Token Management: Get, update, and sync design tokens to a Tailwind config theme extension, with optional push back to Figma.
AI Visual Analysis: Analyze Figma designs with AI vision for general quality, WCAG accessibility compliance, or spec-compliance.
Design System Audit: Run structured audits covering contrast, touch targets, focus indicators, token coverage, and naming conventions.
Design Extraction: Scrape any public URL to extract its design system as a structured
DESIGN.mddocument or raw token JSON.Agent Orchestration: Use a natural language interface to classify, plan, and execute multi-step design workflows.
User Research: Load project-specific insights, personas, and themes to ground design decisions.
Text Layout Measurement: Predict text dimensions, line counts, and overflow risk without a browser or Figma connection.
Health & Usage Monitoring: Check Figma WebSocket bridge health and track AI token usage and estimated session costs.
Extracts design tokens, components, and styles from Figma files via WebSocket bridge, REST API, or plugin, enabling design system synchronization and code generation workflows.
Extracts design systems from Linear's website URLs to generate design documentation and specifications for code generation workflows.
Extracts design tokens, components, and styles from Penpot files using API authentication, providing an alternative design tool integration for design system extraction.
Generates production-ready React components from design specifications with proper props, variants, and component architecture.
Generates production-ready React components using shadcn/ui patterns and includes a shadcn registry server for component management and distribution.
Generates Storybook stories alongside React components for component documentation, testing, and development workflow integration.
Extracts design systems from Stripe's website URLs to generate design documentation and specifications for code generation workflows.
Generates TypeScript-typed React components with proper type definitions and interfaces for type-safe development.
Validates component specifications using Zod schemas to ensure data integrity and consistency throughout the design-to-code pipeline.
Memi
The design layer for agentic AI.
Give your coding agent an interface brief before it edits. Memi maps the UI already in your repository, surfaces file-anchored accessibility and design-system risks, and gives you a deterministic check to rerun before merge. Start with the CLI, then add the same gate to every pull request.
Memi Studio is available today; Memi Canvas is currently in development. No account, API key, Figma file, global install, or daemon is required for the first audit.
Quickstart: find your first interface issue
Run one non-destructive audit in any frontend repository. It needs no account, API key, Figma file, global install, or daemon.
npx -y @memi-design/cli@latest diagnose . --json --no-write --fail-on noneThe result carries normalized finding IDs, confidence, provenance, and file:line evidence so an agent can act on a specific finding instead of guessing.
Give the same context to your coding agent:
npx skills add memi-design/memi --skill audit-frontend-designThen ask:
Audit this frontend before editing it. Prioritize the five changes that will matter most to users, reuse the existing system, and verify the result after the patch.
If Memi catches a real interface issue in your project, share the finding. Real reports are the most useful signal for what to improve next.
Related MCP server: UI Toolkit MCP Server
Put the check on every pull request
Copy examples/github-actions/memi-design.yml into your repository as .github/workflows/memi-design.yml. The starter is pinned to the reviewed public Action commit and gives reviewers:
a PR check that fails only on newly introduced interface debt;
a
memi-design-healthartifact with the human-readable report; andSARIF annotations when the repository grants
security-events: write.
The workflow does not need an API key or a Memi secret. Fork pull requests still receive the check and report; SARIF upload is skipped automatically when GitHub does not grant that permission.
If you prefer to configure it by hand, the complete GitHub Action guide documents every input, output, permission, and evidence file.
One product layer, three surfaces
Surface | What it is | Status |
Memi CLI | Interface intelligence and deterministic checks for local repositories, agents, and CI. | Available today |
Memi Studio | A macOS workbench for bringing project context, agent workflows, and verification together. | |
Memi Canvas | A visual workspace for design-system context and controlled agent proposals. | currently in development |
See the product
Memi Studio | Memi Canvas — in development |
Bring an agent prompt, project memory, and a verification surface into one workbench. | Preview design-system context, inspect a proposal, and keep a human in the loop. This preview shows an active development build, not a released product guarantee. |
What Memi adds to an agent workflow
Before the edit | During the edit | Before merge |
Discover components, tokens, routes, states, and accessibility gaps. | Give the agent a scoped brief that names the system it must preserve. | Rerun deterministic checks and surface new interface debt in CI. |
Need | Start with |
Find UI risks and product-system context |
|
Plan a change around existing components and tokens |
|
Keep new interface debt out of pull requests |
|
Build and verify native Apple interfaces |
|
Compatible with the shadcn registry and v0 design systems.
Evidence at a glance
The V15 confirmatory audit is a public technical disclosure, not a leaderboard. It separates receipt admission, rendered design quality, functional acceptance, and resource observations.
Measured record | Exact reading |
36 / 36 frozen receipts admitted | Every preregistered agent cell had an auditable receipt. This is receipt admission, not universal performance. |
10 complete model-graded matched pairs | Rendered design-quality comparisons that survived the prespecified screen. This is model-graded evidence, not independent practitioner review. |
Buzzr / Expo: mean +1.4; Paraform / web: mean −0.4 | The scoped non-inferiority gate passed on both graded task families. It does not establish general superiority. |
0 / 21 corrected task-by-resource tests rejected | The study did not establish a speed, cost, or token-use advantage. |
Separate historical release record: the 2.7 candidate record reported 2,187 / 2,187 tests passed. It is release evidence, not part of V15 and not proof that every project benefits.
Benchmarks and paper
Quality non-inferiority passed for the scoped Buzzr and Paraform task families. The full paper reports exclusions, failed paths, and limitations without imputation. No superiority, speed, or dollar-savings claim is made. Read the conference-style audit PDF, inspect the protocol and receipts, or review the V17 preregistration.
Memi InterfaceBench v1 is a 100 target tasks specification with 5 pinned seed tasks; it is not an aggregate performance score. The historical candidate record reported 2,187/2,187 tests and 70.57% statements coverage. The greater-than-25% claim remains not verified. Inspect the benchmark contract and workflow evidence.
Memi DesignWorkBench v2 holds 300 task contracts and requires practitioner calibration before any certification claim.
Prompts that map to real workflows
Goal | Copy-paste prompt | Supporting workflow |
Establish a baseline before a UI change | Audit this frontend before editing it. Prioritize the five changes with the clearest |
|
Turn evidence into a scoped plan | Turn the findings into a scoped UI change plan. Reuse existing components and tokens before editing. |
|
Protect a pull request | Set up a deterministic design CI gate for this pull request. Fail only on newly introduced interface debt and save SARIF plus the HTML report. |
|
Research, stated plainly
The research is disclosure material, not a product leaderboard. It keeps functional, rendered-quality, and resource evidence separate so a result cannot be made to say more than the study supports.
Choose your integration
Surface | Start here | Best for |
One-time CLI run |
| Trying Memi without installing |
Global CLI |
| Daily local use |
Agent Skill |
| Codex, Claude Code, Cursor, and compatible agents |
GitHub Action | Pull-request design CI | |
MCP server |
| Any MCP client |
Studio |
| Supervised macOS workflows |
GitHub Action
name: design
on: [pull_request]
permissions:
contents: read
jobs:
memi:
runs-on: ubuntu-latest
permissions:
contents: read
security-events: write
steps:
- uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
with:
fetch-depth: 0
- uses: memi-design/memi@5fcbf39e1255af0c14c5a17ba6bde8cf1206e525 # v2.7.9
with:
version: "2.7.9"
report: true
upload-sarif: trueThe Action adds code-scanning annotations, a step summary, and a memi-design-health artifact. Existing debt can be baselined while newly introduced debt fails the gate.
GitHub Action guide · CI recipes · current versions
Agent and MCP setup
memi agent install codex --project .
memi agent install claude-code --project .
memi agent install cursor --project .
memi agent install grok-build --project .{
"mcpServers": {
"memoire": {
"command": "memi",
"args": ["mcp", "start", "--no-figma"]
}
}
}Codex plugin marketplace:
codex plugin marketplace add memi-design/memi --ref main --sparse .agents/plugins --sparse plugins/memoireAgent stack guide · copy-paste recipes · full skill router
Trust and proof
Release gates — package, provenance, clean-install, MCP, plugin, binary, and public-surface checks.
Current release truth — the public versions for CLI, Studio, and website.
Reproducible case studies — pinned evidence, abstentions, and paired protocols.
Dependency trust ledger — direct dependency purpose, dynamic boundaries, and review policy.
llms.txt— compact machine-readable product map.
Memi has no npm install-time lifecycle scripts, no source upload or covert telemetry, explicit Figma connection, agent-kit --dry-run --json, immutable Action pins, and documented third-party boundaries in NOTICE.
Community
We welcome contributions. See CONTRIBUTING.md for setup and pull-request guidance. Bugs and feature requests belong in issues; questions and real project reports belong in Discussions.
Useful contributions include reproducible audit fixtures, framework adapters, skill improvements, accessible UI cases, motion checks, and before/after reports.
License
Studio interface references and adapted components include Hermes WebUI and the MIT Warp UI framework boundary around warpui_core and warpui; Warp AGPL application and client code is not copied into Memi.
MIT. See NOTICE for optional adapters and complete third-party attribution.
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Servers
- Alicense-qualityCmaintenanceMCP server that exposes your design system components and tokens to AI agents, preventing duplicate component creation and hardcoded token values.199MIT
- Alicense-qualityCmaintenanceComprehensive MCP server for end-to-end UI development, offering tools to generate components, manage design tokens, audit accessibility, autofix issues, inspect live pages, compare screenshots, and more across multiple frameworks.17MIT
- AlicenseAqualityAmaintenanceMCP server for the Lando Labs Design System, enabling AI agents to introspect and generate code for React components, hooks, icons, design tokens, and theme presets via 15 tools.15241Apache 2.0
- Alicense-qualityCmaintenanceToken-efficient Figma MCP server with image export, query DSL, and design token support.5MIT
Related MCP Connectors
Turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code.
On-demand drift checks: declared CSS color, radius, spacing & type vs your own tokens or a pack
UI design from prompts, screenshots, and URLs for AI coding agents and theme tokens.
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/memi-design/memi'
If you have feedback or need assistance with the MCP directory API, please join our Discord server