google-labs-code/stitch-skills

Что это?

Ключевые возможности

• 01Создаёт новые экраны Stitch по тексту или изображениям и редактирует существующие.
• 02Извлекает файлы дизайн-систем DESIGN.md из исходного кода фронтенда.
• 03Преобразует экраны Stitch в код дашбордов на React, React Native или React + Vite.
• 04Загружает локальные HTML-файлы, изображения и макеты в проекты Stitch.
• 05Устанавливается в Claude Code, Cursor, Codex, Gemini CLI и другие агенты, совместимые с Agent Skills.

Сценарии использования

• Преобразование существующей кодовой базы фронтенда в дизайн Stitch для проверки и доработки.
• Создание React-компонентов по экранам Stitch с сохранением единообразия дизайн-токенов.
• Создание DESIGN.md с описанием визуальной системы проекта, которому смогут следовать другие агенты.
• Создание обучающего видео с обзором проекта Stitch.

Быстрый старт

1. 1

   Добавьте маркетплейс Stitch Skills в Codex через CLI

   codex plugin marketplace add google-labs-code/stitch-skills --ref main --sparse .agents/plugins --sparse plugins/stitch-design --sparse plugins/stitch-build --sparse plugins/stitch-utilities
2. 2

   Или устанавливайте только нужные навыки с помощью npx

   npx skills add google-labs-code/stitch-skills

Что важно знать

• !Для работы навыков необходимо предварительно настроить MCP-сервер Stitch и учетные данные.
• !Этот продукт не поддерживается Google официально.

Темы

Частые вопросы

Что такое stitch-skills?

Набор Agent Skills и плагинов, с помощью которых агенты для программирования работают с дизайн-проектами Google Stitch через сервер Stitch MCP. Stitch Skills — это набор навыков для Google Stitch, инструмента для дизайна. Каждый навык — папка с инструкциями, которые агент для программирования, например Claude Code, Cursor, Codex или Gemini CLI, может загрузить для выполнения конкретного сценария работы со Stitch. Для навыков требуется настроить сервер Stitch MCP в окружении агента.

stitch-skills можно использовать бесплатно? Какая у него лицензия?

stitch-skills распространяется с открытым исходным кодом под лицензией Apache-2.0. Перед использованием в коммерческих продуктах проверьте условия лицензии.

stitch-skills всё ещё поддерживается?

Обновлялся за последние 6 месяцев. Последний коммит в stitch-skills — 17 авг. 2026 г..

Для чего можно использовать stitch-skills?

Преобразование существующей кодовой базы фронтенда в дизайн Stitch для проверки и доработки. Создание React-компонентов по экранам Stitch с сохранением единообразия дизайн-токенов. Создание DESIGN.md с описанием визуальной системы проекта, которому смогут следовать другие агенты. Создание обучающего видео с обзором проекта Stitch.

Как установить stitch-skills?

Добавьте маркетплейс Stitch Skills в Codex через CLI: codex plugin marketplace add google-labs-code/stitch-skills --ref main --sparse .agents/plugins --sparse plugins/stitch-design --sparse plugins/stitch-build --sparse plugins/stitch-utilities Или устанавливайте только нужные навыки с помощью npx: npx skills add google-labs-code/stitch-skills

Где скачать stitch-skills?

Исходный код и инструкции по установке — на GitHub: https://github.com/google-labs-code/stitch-skills