design-system-rules-agent — субагент для Codex: правила Figma-to-code
Субагент собирает правила переноса макетов Figma в код и складывает их в AGENTS.md, чтобы следующие реализации шли по одним и тем же конвенциям.
.codex/agents/design-system-rules-agent.tomlЧто делает design-system-rules-agent
Агент работает в паре с Figma MCP: сначала вызывает инструмент create_design_system_rules, потом изучает кодовую базу — где лежат компоненты, какие есть токены и как принято писать стили. На выходе получается не абстрактный совет, а конкретные проверяемые правила.
Результат оформлен так, чтобы его можно было сразу вставить в AGENTS.md: находки по коду, предложенные правила, место сохранения и план проверки на небольшой тестовой реализации. Установка сводится к одному файлу — .codex/agents/design-system-rules-agent.toml.
Без подключённого Figma MCP шаг с create_design_system_rules не выполнится, и правила придётся писать вручную. Это повод сначала проверить, что MCP-сервер Figma доступен в вашей сессии Codex.
Какие задачи решает
- собрать правила Figma-to-code в один файл
- найти реальные пути к компонентам и токенам в проекте
- зафиксировать конвенции стилей для будущих задач
- проверить правила на маленькой тестовой реализации
- обновить
AGENTS.md, когда структура проекта поменялась
Примеры запросов агенту
- прогони design-system-rules-agent и предложи правила для
AGENTS.md - изучи кодовую базу и собери конвенции Figma-to-code
- обнови правила дизайн-системы и покажи план проверки
Как установить design-system-rules-agent
Вручную: положить файлы
.codex/agents/design-system-rules-agent.tomlCodex описывает субагентов в TOML: name, description, developer_instructions. Текст из Markdown перенесите в developer_instructions вручную. Для всех проектов — ~/.codex/agents/
Вручную: положить файлы
.claude/agents/design-system-rules-agent.mdДля всех проектов — ~/.claude/agents/. Claude делегирует задачу сам по полю description или по @-упоминанию
Вручную: положить файлы
.cursor/agents/design-system-rules-agent.mdCursor понимает и .claude/agents/
По шагам, с командами для каждой платформы: Субагенты Claude Code: как создать, вызвать и не утопить контекст
Вопросы о design-system-rules-agent
Как установить design-system-rules-agent в Claude?
Создайте файл .codex/agents/design-system-rules-agent.toml — это единственный шаг установки для Claude.
Что делает design-system-rules-agent?
Генерирует или обновляет правила Figma-to-code для AGENTS.md: анализирует компоненты, токены и стили в кодовой базе, а затем выдаёт готовый к вставке набор правил.
Что нужно для работы агента?
Доступ к инструменту Figma MCP create_design_system_rules — агент вызывает его перед тем, как писать финальные правила.
