npm install -g @sarveshsea/memoire
01

Agents don't have
design skills.

We gave it notes.

27 deep knowledge files. Up to 5,585 lines of real design expertise that agents absorb in a single breath. 8 adapted from the official Figma MCP Server Guide.

CRAFT5,585 lines
Figma Library Builder
5-phase Figma component library workflow with 9 Plugin API scripts. Adapted from the official Figma MCP Server Guide.
GENERATE1,676 lines
Flutter Generator
Material 3 widgets with Riverpod state, responsive layouts, and platform-adaptive patterns from specs.
CRAFT1,466 lines
Mobile Craft
Mobile-first design mastery: touch targets, safe areas, platform conventions, gesture systems, responsive patterns.
CONNECT1,228 lines
Notion Sync
Sync research insights, specs, and project context between Notion databases and the registry.
RESEARCH894 lines
Competitive Intel
Market analysis frameworks, feature matrices, UX benchmarking, strategic positioning, trend synthesis.
GENERATE183 lines
Figma Implement Design
Figma-to-code with MCP context extraction, token mapping, and 1:1 visual parity validation.
or run memi notes list
02

AI design tools don't have persistent memory like dev tools. Mémoire generates a full shippable dashboard for human/agent communication.

localhost:5173/systems
Open full dashboard
03

Figma bridges break. This one stays connected.

Native WebSocket connection with built-in logging and parallel multi-instance support.

Mémoire
memoireconnectedLabor Budgeting 3.1
PORT
:9223
Mémoire Terminal
EVENTS
174
79+ 8/ 0x
UPTIME
9:29
session
PING
1ms
healthy
Ports
92239224922592269227
LOGACTIONSSELECTION174 clear
07:44:03 PM+Identified: Mémoire Terminal
07:44:03 PM+Identified: Mémoire Terminal
07:44:03 PM.Reconnecting in 16.3s...
07:44:07 PM.MSG:pong
07:44:17 PM.MSG:pong
07:44:20 PM+Identified: Mémoire Terminal
07:44:20 PM.Reconnecting in 16.1s...
07:44:27 PM.MSG:pong
localhost:5173/monitor
mémoireHOMERESEARCHSPECSSYSTEMSMONITORCHANGELOG12 EVENTS CLIENTS
Connected to dashboardport 3334
BRIDGE PORT
9224
WebSocket server
CONNECTED PLUGINS
active connection
EVENTS RECEIVED
12
Since page load
UPTIME
56s
SSE stream
ACTIONS
Inspect SelectionPull TokensPull ComponentsPage TreeStickiesFull Sync
PORT SCANNER (9223-9232)
9223--
9224LISTENING
9225--
9226--
9227--
LIVE EVENT STREAMAUTO-SCROLL CLEAR
19:44:20plugin-disconnectedPlugin disconnected
19:44:36event[info] Figma plugin connected
19:44:36plugin-connectedunknown via figma
19:44:36event[info] Figma plugin disconnected
19:44:52plugin-connectedunknown via figma
USER FLOW
01
Figma File
your design system
memi pull
02
Design System
tokens + components
memi spec
03
Spec JSON
atomic definition
memi generate
04
Component.tsx
shadcn/ui + Tailwind
04

One package. Native design fluency for every agent.

MEMOIRE CLI
ALL COMMANDS
npm install -g @sarveshsea/memoire
CommandDescriptionExample
memoire connectConnect to Figma. Guided setup, WebSocket handshake, plugin auto-discovery.memoire connect --name my-project
memoire pullPull design system from connected Figma file: tokens, components, styles.memoire pull
memoire specCreate or edit specs: component, page, dataviz with Atomic Design.memoire spec component Card --level molecule
memoire generateGenerate code from specs: shadcn/ui + Tailwind + TypeScript into atomic folders.memoire generate UserProfileCard
memoire composeNatural language to code: intent classifier, dependency DAG, agent orchestrator.memoire compose "build a dashboard"
memoire researchResearch pipeline: Excel, CSV, FigJam stickies to structured insights.memoire research from-file survey.xlsx
memoire dashboardLaunch the dashboard: design systems, specs, prototypes, research on localhost.memoire dashboard
memoire tokensExport design tokens as CSS, Tailwind, or JSON with optional shadcn mapping.memoire tokens --shadcn
memoire prototypeCinematic prototype: Playwright video + interactive HTML with transitions.memoire prototype --transition cinematic
memoire syncFull sync: Figma to design system, regenerate all specs, preview.memoire sync
memoire goFull pipeline: connect, pull, generate, and open preview in one command.memoire go
memoire doctorHealth check: validates all connections, specs, tokens, and workspace.memoire doctor
memoire iaInformation architecture: extract, create, validate, visualize site structure.memoire ia extract my-site
memoire exportExport generated components into your project source tree.memoire export --dry-run
memoire notesManage skill packs: install, list, create, remove.memoire notes install github:user/repo
memoire initInteractive onboarding: set up memoire for your project.memoire init
Process

Built from real friction.

01
The problem was specific
I was building Buzzr and Labor Budgeting simultaneously, both with large Figma design systems. Every time I opened Claude Code, the agent had no idea what colors, spacing, or components to use. It generated plausible-looking code that was completely off-brand. The fix could not be manual. I was too deep in the build.
02
MCP was the unlock
When Anthropic released the Model Context Protocol, the architecture became clear. Instead of pasting design tokens into every chat, I could build a server that agents query on demand. Mémoire became that server: a local MCP endpoint that holds your full design system and answers whatever the agent asks.
03
Knowledge files were a surprise
Writing a 5,585-line Figma Library Builder document is not enjoyable. But when an agent loads it before a session, the quality difference is dramatic. The agent references atomic design terminology correctly and produces work that reads like it came from a senior designer.
04
The CLI came from repeated pain
Every workflow started as a long Claude Code prompt. memi pull started as: read my Figma file, extract all tokens, format them as CSS variables. memi spec: given this Figma component, write a JSON spec following atomic design hierarchy. The CLI wraps those prompts with validation and error handling added after things broke in production.
05
The dashboard closed the loop
Agent sessions leave no trace. You run Claude Code, it generates a component, and three weeks later you have no idea what decisions were made or why. The dashboard was built to solve this: a persistent record of design system state, spec history, research data, and agent activity.
Reflection

What I learned.

01
Ship the tool you need
Mémoire was built to solve my own problem. Every feature was added because I needed it on a real project. Solving for yourself first is the fastest path to something real and honest.
02
Agents need structure to reason well
The quality jump from zero-context to knowledge-file agent is enormous. The design thinking has to live somewhere. Putting it in a file an agent can read is the insight.
03
The loop matters more than the feature
The dashboard was the last thing I built and the most important. Persistent memory is what turns a one-off tool into a workflow. Close the loop or you have a script, not a system.

More Work