implement-design

от figma

Преобразует дизайны Figma в production-ready код с попиксельной визуальной точностью. Требует подключения к Figma MCP серверу и URL Figma с ключом файла и ID узла для извлечения контекста дизайна, скриншотов и ассетов. Семиэтапный структурированный процесс: разбор URL, получение контекста дизайна, захват визуального референса, загрузка ассетов, перевод в конвенции проекта, достижение паритета 1:1 и валидация против Figma. Приоритизирует переиспользование дизайн-системы над дублированием; сопоставляет токены Figma с проектным дизайном...

npx skills add https://github.com/figma/mcp-server-guide --skill implement-design

Больше skills от figma

video-interaction-mapper
figma
Этот навык следует использовать, когда пользователь просит проанализировать запись экрана интерфейса и сопоставить состояния взаимодействия в Figma. Триггер для запросов, таких как "поместить видео…
figma-code-connect
figma
Создаёт и поддерживает файлы шаблонов Figma Code Connect, которые сопоставляют компоненты Figma с фрагментами кода. Используйте, когда пользователь упоминает Code Connect, компонент Figma…
create-design-system-rules
figma
Пользовательские правила дизайн-системы для согласованной реализации Figma-to-code в вашем проекте. Генерирует проектные конвенции для организации компонентов, стилизации, дизайн-токенов и обработки ассетов, которые направляют AI-агентов на создание согласованного кода. Поддерживает три формата файлов правил: CLAUDE.md для Claude Code, AGENTS.md для Codex CLI и .cursor/rules/figma-design-system.mdc для Cursor. Требует подключения Figma MCP-сервера и анализа кодовой базы для обнаружения существующих паттернов перед созданием правил...
figma-implement-motion
figma
Переводит анимации и движения из Figma в готовый к использованию код приложения. Используйте при реализации анимации/движения из дизайна Figma — пользователь упоминает…
figma-swiftui
figma
Перевод SwiftUI ↔ Figma. Используйте, когда пользователь упоминает Swift, SwiftUI, iOS, iPhone или iPad — в любом направлении — переводя дизайн Figma в…
figma-use-motion
figma
Motion / animation context for the `use_figma` MCP tool — animating Figma nodes via manual keyframes, animation styles, easing, and timeline duration. Load…
figma-use-slides
figma
Этот навык помогает агентам использовать MCP-инструмент use_figma в контексте Slides. Может использоваться вместе с figma-use, который содержит базовый контекст для использования…
figma-use-figjam
figma
Этот навык помогает агентам использовать MCP-инструмент use_figma от Figma в контексте FigJam. Может использоваться вместе с figma-use, который содержит базовый контекст для использования…