memoire
Попробуйте прямо сейчас
npx @sarveshsea/memoire design-doc https://stripe.comИзвлекает цвета, типографику, отступы, тени и паттерны компонентов с любого публичного URL. Создает файл DESIGN.md с наброском конфигурации Tailwind. 10 секунд. Нулевая настройка.
Что вы получаете
Входные данные | Выходные данные |
Любой публичный URL |
|
Файл Figma (REST или плагин) | Дизайн-токены, компоненты, стили |
Файл Penpot | Те же токены, тот же конвейер |
JSON-спецификации | Компоненты React + TypeScript + Tailwind (shadcn/ui) |
Сгенерированные компоненты | Storybook-истории + сервер реестра 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Использование с Claude Code / Cursor
Memoire — это MCP-сервер с 20 инструментами. Предоставьте вашему ИИ-ассистенту прямой доступ к вашей дизайн-системе.
memi mcp config --install # writes .mcp.json, doneИли добавьте вручную в .mcp.json:
{
"mcpServers": {
"memoire": {
"command": "memi",
"args": ["mcp", "start"]
}
}
}Инструменты включают: pull_design_system, generate_code, create_spec, get_tokens, compose, design_doc, run_audit, capture_screenshot, analyze_design и еще 11.
Полный справочник команд
Команда | Что она делает |
| Полная настройка: токен, файл, плагин, мост, конфигурация MCP, тестовое получение |
| Инициализация рабочего пространства со стартовыми спецификациями |
| Запуск моста Figma (автоматическое обнаружение плагина на портах 9223-9232) |
| Извлечение токенов, компонентов, стилей из Figma |
| Получение через REST API — без плагина, без Figma Desktop |
| Получение из Penpot (требуются |
| Создание спецификации компонента, страницы или визуализации данных |
| Генерация кода shadcn/ui + Storybook-историй на основе спецификаций |
| Генерация без Storybook-историй |
| Запуск галереи предпросмотра + сервера реестра shadcn |
| Полный конвейер одной командой |
| Экспорт сгенерированного кода в ваш проект |
| Экспорт токенов в формате CSS / Tailwind / JSON / Style Dictionary (W3C DTCG) |
| Проверка всех спецификаций на соответствие схемам |
Команда | Что она делает |
| Извлечение дизайн-системы из любого URL в DESIGN.md |
| Дополнительно создает DesignSpec JSON для генерации кода |
| Псевдоним для design-doc |
Команда | Что она делает |
| Полная синхронизация: Figma + спецификации + код |
| Отслеживание и непрерывная синхронизация |
| Оркестратор агентов: классификация, планирование, выполнение |
| Запуск постоянного агента-исполнителя |
| Обработка Excel/CSV в исследование |
| Синтез тем и персонажей |
| Запуск демона с реактивным конвейером |
Команда | Что она делает |
| Обзор состояния проекта |
| Проверка работоспособности: проект, плагин, мост |
| Запуск панели мониторинга |
| Аудит дизайн-системы (WCAG, неиспользуемые спецификации) |
Все команды поддерживают --json для структурированного вывода.
Рабочий процесс «сначала спецификация»
Каждый компонент начинается как JSON-спецификация перед генерацией кода:
{
"name": "MetricCard",
"type": "component",
"level": "molecule",
"shadcnBase": ["Card", "Badge"],
"props": { "title": "string", "value": "string", "trend": "string?" },
"variants": ["default", "compact"]
}Спецификации проверяются с помощью схем Zod. Компоненты следуют методологии Atomic Design (атом, молекула, организм, шаблон, страница).
Архитектура
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)Ссылки
memoire.cv -- Журнал изменений -- Документация MCP -- Заметки
Лицензия
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