iiuniversitet.ruЦентр обучения нейросетямОткрыть каталог

Макет в код

Переводит макет или скриншот в вёрстку на выбранном стеке.

СкиллРазработано в iiuniversitetCodexНаш материалНужен терминалПроверка не требуется
Скачать архив
Что делает
Переводит макет или скриншот в вёрстку на выбранном стеке.
Когда брать
Когда вы просите: «сверстай этот экран» или «макет в код».
Пример запроса
$figma-to-code сверстай этот экран

Как включить

  1. Скачайте архив и распакуйте его.
  2. Положите папку figma-to-code в ~/.agents/skills/.
  3. Вызовите скилл командой $figma-to-code или найдите его через /skills.

Текст

---
name: figma-to-code
description: "Переводит макет или скриншот в вёрстку на выбранном стеке. Используй, когда пользователь просит: «сверстай этот экран» или «макет в код». Не используй для задач вне этой темы."
---

Макет в код

Переводит макет или скриншот в вёрстку на выбранном стеке.

Перед началом

Прочитай AGENTS.md и README, определи стек, команды сборки и тестов. Работай в текущей ветке, не трогай несвязанные файлы.

Порядок работы

  1. Разобрать макет на компоненты.
  2. Определить токены.
  3. Сверстать.
  4. Сравнить с макетом.
  5. Проверь результат по правилам ниже и кратко опиши, что сделано.

Формат результата

Код компонентов.

Правила

  • Используй существующие компоненты и токены проекта.
  • Проверяй вёрстку на мобильной ширине.
  • Не добавляй новые зависимости без необходимости.

Пример вызова

$figma-to-code сверстай этот экран

Разработано в iiuniversitet — https://iiuniversitet.ru/?utm_source=bonus&utm_medium=skill&utm_campaign=katalog&utm_content=figma-to-code

Автор: iiuniversitet. Каталог скиллов iiuniversitet.

Похожие