figma-generate-design

ui-skills/figma · Agent Skill

Переводите страницы и макеты с несколькими разделами в Figma, обнаруживая компоненты дизайн-системы, переменные и собирая экраны раздел за разделом.

Перейти к установке ↓

Обзор

Автор	figmaОрганизация
Репозиторий	ui-skills/figma
Папка скилла	`figma-figma-generate-design`
Файлы	только SKILL.md
Ссылки	Исходник скилла ↗

Проверка Mozgi

Что мы нашли в файлах скилла. Подробности — по подписке.

Безопасность

файлы скилла ещё не проверены

Совместимость

файлы скилла ещё не проверены

Похожие скиллы

найдено 139 похожих скиллов

Ещё в подписке

Установка

Скилл — это папка с файлом SKILL.md. Выберите своего агента и скопируйте команды в терминал (macOS, Linux или Git Bash на Windows) в корне проекта.

Скопируйте промпт и вставьте в Claude, Codex или другого ассистента: он сам проверит скилл и подключит его.

Установи мне скилл «figma-generate-design» с mozgi.io (https://mozgi.io/skills/figma-figma-generate-design/).

1. Открой страницу скилла https://mozgi.io/skills/figma-figma-generate-design/ и возьми оттуда текст SKILL.md.
2. Прочитай SKILL.md и остальные файлы. Проверь, что скилл безопасен: нет скрытых команд, отправки данных наружу или скриптов, которые делают не то, что описано. Если что-то подозрительно — остановись и скажи мне.
3. Положи папку «figma-generate-design» в папку скиллов своего агента: .claude/skills/ для Claude Code, .agents/skills/ для Codex, .cursor/skills/ для Cursor, .gemini/skills/ для Gemini CLI. В проекте — внутри проекта, иначе в домашней папке (~/.claude/skills/ и т. п.).
4. Убедись, что получилось <папка скиллов>/figma-generate-design/SKILL.md.
5. Коротко расскажи, что умеет этот скилл, и предложи попробовать его на моей задаче.

Если какой-то шаг не можешь сделать сам — подскажи, что нажать или ввести.

Вопросы и ответы

Что делает скилл figma-generate-design?

Как установить figma-generate-design?

Откройте блок «Установка» на этой странице и выберите своего агента — Claude Code, Codex, Cursor или Gemini CLI: там готовые команды, которые копируют папку скилла в нужное место. Либо скопируйте промпт из вкладки «Через ассистента» — ассистент сам проверит и подключит скилл.

С какими нейросетями работает figma-generate-design?

Скиллы — это обычные инструкции в Markdown (формат Agent Skills), поэтому figma-generate-design подходит любому агенту, который читает SKILL.md: Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode и другие. Модель загружает инструкции только когда задача подходит под описание скилла.

Скилл figma-generate-design бесплатный?

Скилл опубликован автором figma в открытом доступе. Сам скилл ничего не стоит — вы платите только своему провайдеру нейросети за использованные токены. Лицензия в репозитории не указана — перед коммерческим использованием уточните условия у автора.

Безопасно ли устанавливать скиллы?

Скилл — это инструкции, которые агент будет выполнять, поэтому перед установкой прочитайте SKILL.md и сопутствующие файлы. Скрипты из папки скилла запускаются только если их запустит агент — следите за тем, что он делает, и не давайте лишних прав.

Чем скилл отличается от MCP-сервера или плагина?

MCP-сервер и плагин дают модели новые инструменты — код, который выполняется и возвращает результат. Скилл даёт знания и порядок действий: как подходить к задаче, какие шаги делать и как выглядит хороший результат. Ему не нужен сервер или ключ API.

Похожие скиллы

Все скиллы →

figma-code-connect Создает и поддерживает файлы шаблонов Figma Code Connect, которые сопоставляют компоненты Figma с фрагментами кода. Используется, когда пользователь упоминает Code Connect, сопоставление компонентов Figma, перевод дизайна в код или запрашивает создание/обновление файлов .figma.ts или .figma.js. figma

figma-create-new-file **ОБЯЗАТЕЛЬНОЕ предварительное условие** — вы ДОЛЖНЫ вызвать этот навык ДО каждого вызова инструмента `create_new_file`. НИКОГДА не вызывайте `create_new_file` напрямую без предварительной загрузки этого навыка. Срабатывайте всякий раз, когда пользователь хочет новый пустой файл Figma — новый дизайн, FigJam или файл Slides — или когда вам нужен свежий файл перед вызовом `use_figma`. Применение — /figma-create-new-file [editorType] [fileName] (например, /figma-create-new-file figjam Моя доска, /figma-create-new-file slides Обзор за 3 квартал) figma

figma-design-to-code **ОБЯЗАТЕЛЬНОЕ предварительное условие** — вы ДОЛЖНЫ вызвать этот навык ДО вызова инструмента Figma MCP `get_design_context`. Вы ДОЛЖНЫ запустить этот навык всякий раз, когда пользователь хочет реализовать, построить, перенести или написать код для дизайна Figma. Примерные подсказки (не исчерпывающие) — 'реализовать этот дизайн Figma', 'построить этот экран из Figma', 'превратить этот Figma в код', 'дизайн в код'. Этот навык предоставляет критически важные инструкции и шаги агенту о том, как правильно реализовать дизайны Figma в коде, и НЕ ДОЛЖЕН быть пропущен. figma

figma-generate-diagram ОБЯЗАТЕЛЬное предварительное условие — загрузите этот навык ДО каждого вызова инструмента `generate_diagram`. НИКОГДА не вызывайте `generate_diagram` напрямую без предварительной загрузки этого навыка. Срабатывайте всякий раз, когда пользователь просит создать, сгенерировать, нарисовать, отрендерить, набросать или построить диаграмму — блок-схему, диаграмму архитектуры, диаграмму последовательности, ERD или диаграмму сущность-связь, диаграмму состояния или машина состояний, диаграмму Ганта или временную шкалу. Также срабатывайте, когда пользователь упоминает синтаксис Mermaid или хочет визуализировать системную архитектуру, дерево решений, граф зависимостей, поток вызовов API, рукопожатие аутентификации, схему или конвейер в FigJam. Маршрутизирует к типоспецифическим рекомендациям, устанавливает универсальные ограничения Mermaid и сообщает, когда следует использовать другой тип диаграммы или вообще отказаться от инструмента (майнд-карты, круговые диаграммы, диаграммы классов и т. д.). figma

figma-swiftui Перевод SwiftUI ↔ Figma. Используйте всякий раз, когда пользователь упоминает Swift, SwiftUI, iOS, iPhone или iPad — в ЛЮББЫХ направлениях — переводя дизайн Figma в SwiftUI (дизайн → код), или передавая представления SwiftUI / экраны / токены обратно в файл Figma (код → дизайн). Срабатывает на фразах типа 'реализовать этот дизайн Figma в SwiftUI', 'создать этот экран на Swift', 'передать это представление SwiftUI в Figma', 'отразить мой код Swift в файле Figma', или всякий раз, когда появляется URL-адрес Figma вместе с файлами `.swift` / `.xcodeproj`. Перенаправляет в справочный документ, специфичный для направления; загружается вместе с `figma-use` для пути код → дизайн. figma

figma-use-figjam Этот навык помогает агентам использовать инструмент Figma use_figma MCP в контексте FigJam. Может использоваться вместе с figma-use, который имеет базовый контекст для использования инструмента use_figma. figma