Skip to main content
Glama

Pruébalo ahora

npx @sarveshsea/memoire design-doc https://stripe.com

Extrae colores, tipografía, espaciado, sombras y patrones de componentes de cualquier URL pública. Genera un archivo DESIGN.md con un esquema de configuración de Tailwind. 10 segundos. Configuración cero.


Qué obtienes

Entrada

Salida

Cualquier URL pública

DESIGN.md con inventario completo de tokens + configuración de Tailwind

Archivo de Figma (REST o plugin)

Tokens de diseño, componentes, estilos

Archivo de Penpot

Mismos tokens, misma tubería

Especificaciones JSON

Componentes de React + TypeScript + Tailwind (shadcn/ui)

Componentes generados

Historias de Storybook + servidor de registro shadcn

npm i -g @sarveshsea/memoire

memi design-doc https://linear.app     # extract any site's design system
memi go                                 # figma -> tokens -> specs -> components -> preview
memi go --rest                          # same thing, no figma desktop needed
memi go --penpot                        # same thing, from penpot
memi tokens                             # export as CSS / Tailwind / JSON / Style Dictionary

Úsalo con Claude Code / Cursor

Memoire es un servidor MCP con 20 herramientas. Dale a tu asistente de IA acceso directo a tu sistema de diseño.

memi mcp config --install              # writes .mcp.json, done

O añádelo manualmente a .mcp.json:

{
  "mcpServers": {
    "memoire": {
      "command": "memi",
      "args": ["mcp", "start"]
    }
  }
}

Las herramientas incluyen: pull_design_system, generate_code, create_spec, get_tokens, compose, design_doc, run_audit, capture_screenshot, analyze_design, y 11 más.


Referencia completa de comandos

Comando

Qué hace

memi setup

Onboarding completo: token, archivo, plugin, puente, configuración MCP, prueba de extracción

memi init

Inicializa el espacio de trabajo con especificaciones iniciales

memi connect

Inicia el puente de Figma (detecta automáticamente el plugin en los puertos 9223-9232)

memi pull

Extrae tokens, componentes y estilos de Figma

memi pull --rest

Extrae mediante API REST: sin plugin, sin Figma Desktop

memi pull --penpot

Extrae de Penpot (necesita PENPOT_TOKEN + PENPOT_FILE_ID)

memi spec <type> <name>

Crea una especificación de componente, página o visualización de datos

memi generate [name]

Genera código shadcn/ui + historias de Storybook a partir de especificaciones

memi generate --no-stories

Genera sin historias de Storybook

memi preview

Inicia la galería de vista previa + servidor de registro shadcn

memi go

Tubería completa en un solo comando

memi export

Exporta el código generado a tu proyecto

memi tokens

Exporta tokens como CSS / Tailwind / JSON / Style Dictionary (W3C DTCG)

memi validate

Valida todas las especificaciones contra esquemas

Comando

Qué hace

memi design-doc <url>

Extrae el sistema de diseño de cualquier URL a DESIGN.md

memi design-doc <url> --spec

También escribe un DesignSpec JSON para la generación de código

memi extract <url>

Alias para design-doc

Comando

Qué hace

memi sync

Sincronización completa: Figma + especificaciones + código

memi sync --live

Observa y sincroniza continuamente

memi compose "<intent>"

Orquestador de agentes: clasifica, planifica, ejecuta

memi agent spawn <role>

Genera un agente trabajador persistente

memi research from-file <path>

Procesa Excel/CSV en investigación

memi research synthesize

Sintetiza temas y personas

memi daemon start

Inicia el demonio con tubería reactiva

Comando

Qué hace

memi status

Resumen del estado del proyecto

memi doctor

Verificación de salud: proyecto, plugin, puente

memi dashboard

Inicia el panel de monitoreo

memi audit

Auditoría del sistema de diseño (WCAG, especificaciones no utilizadas)

Todos los comandos admiten --json para una salida estructurada.


Flujo de trabajo basado en especificaciones

Cada componente comienza como una especificación JSON antes de generar el código:

{
  "name": "MetricCard",
  "type": "component",
  "level": "molecule",
  "shadcnBase": ["Card", "Badge"],
  "props": { "title": "string", "value": "string", "trend": "string?" },
  "variants": ["default", "compact"]
}

Las especificaciones se validan con esquemas Zod. Los componentes siguen el Diseño Atómico (átomo, molécula, organismo, plantilla, página).


Arquitectura

src/
  engine/     Core orchestrator, registry, sync, pipeline
  figma/      WebSocket bridge + REST client + Penpot client
  agents/     Intent classifier, plan builder, task queue
  mcp/        MCP server (20 tools, 3 resources, stdio)
  codegen/    shadcn/ui mapper, Storybook, dataviz, pages
  research/   Research engine (Excel, stickies, web)
  specs/      Spec types, Zod schemas, 62-component catalog
  preview/    Preview gallery, API server, shadcn registry
  notes/      Downloadable skill packs
  commands/   28 CLI commands
  plugin/     Figma plugin (Widget V2)

Enlaces

memoire.cv -- Registro de cambios -- Documentación MCP -- Notas

Licencia

MIT

Latest Blog Posts

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/sarveshsea/m-moire'

If you have feedback or need assistance with the MCP directory API, please join our Discord server