Google открыл библиотеку Stitch Skills для AI-агентов

Google открыл библиотеку Stitch Skills для AI-агентов

Google Labs опубликовал на GitHub репозиторий stitch-skills — коллекцию Agent Skills (навыков агента) для работы с платформой Google Stitch через MCP-сервер. Библиотека следует открытому стандарту Agent Skills и совместима с ведущими coding-агентами: Claude Code, Cursor, Gemini CLI, Codex и Antigravity. Разработчики получают готовый набор инструментов, позволяющий AI-агентам генерировать UI-дизайны, конвертировать их в код и управлять дизайн-системами прямо из редактора кода.

Что такое Google Stitch и зачем нужны Skills

Stitch — AI-инструмент Google, который трансформирует текстовые промпты в готовые UI-дизайны и production-ready код. Он был представлен на Google I/O 2025 и использует Gemini 2.5 Pro/Flash для генерации интерфейсов мобильных и веб-приложений за секунды.

Google Stitch MCP — это интеграция на базе Model Context Protocol, позволяющая AI-инструментам для кодинга (Claude Code, Cursor, Windsurf, Cline) вызывать Google Stitch напрямую из редактора. Вместо того чтобы переключаться между редактором и stitch.withgoogle.com, разработчик просит агента «спроектировать и реализовать новый дашборд» — агент обращается к Stitch за дизайном, а затем реализует его в кодовой базе.

Три плагина: Design, Build, Utilities

Библиотека stitch-skills организована в три плагина, каждый из которых решает свой круг задач.

stitch-design — дизайн из кода и промптов

• stitch::code-to-design — конвертирует фронтенд-код (React, Vue и др.) в дизайн Stitch через HTML-экстракцию
• stitch::generate-design — генерирует новые экраны из текста или изображений, создаёт варианты дизайна
• stitch::manage-design-system — загружает файл DESIGN.md и применяет темы ко всем экранам
• stitch::extract-static-html — извлекает самодостаточный статический HTML из работающих веб-приложений

stitch-build — код из дизайна

• stitch::react-components — конвертирует экраны Stitch в React-компоненты с автоматической валидацией и дизайн-токенами
• stitch::react-native — генерирует production-ready React Native компоненты с StyleSheet и платформо-специфичным кодом
• remotion — создаёт walk-through видео из проектов Stitch с помощью Remotion
• shadcn-ui — помощь по интеграции и сборке приложений на shadcn/ui

stitch-utilities — улучшение промптов и дизайн-спецификации

• enhance-prompt — превращает расплывчатые идеи UI в чёткие Stitch-оптимизированные промпты
• stitch-loop — генерирует полноценные многостраничные сайты из одного промпта
• taste-design — создаёт DESIGN.md с требованиями к «premium, anti-generic» UI

Структура каждого навыка

Все навыки следуют единой архитектуре Agent Skills open standard:

skills/<skill-name>/
├── SKILL.md      — «Центр управления» для агента
├── scripts/      — Исполняемые скрипты (валидация и сеть)
├── resources/    — База знаний (чеклисты и гайды)
└── examples/     — Эталонные примеры

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

Для Claude Code и Cursor установка выглядит иначе:

# Claude Code — устанавливает в текущий проект
npx plugins add google-labs-code/stitch-skills --scope project --target claude-code

# Cursor — устанавливает в текущий воркспейс
npx plugins add google-labs-code/stitch-skills --scope workspace --target cursor

Как работает полный воркфлоу

graph TD
    A[Разработчик пишет промпт в агенте] --> B[Агент вызывает Stitch Skill]
    B --> C{Тип задачи}
    C -->|Дизайн| D[stitch-design: генерация UI]
    C -->|Код| E[stitch-build: React / RN компоненты]
    C -->|Утилиты| F[stitch-utilities: DESIGN.md, промпты]
    D --> G[MCP-сервер Stitch]
    E --> G
    F --> G
    G --> H[Готовый дизайн / код в проекте]

Разработчик пишет промпт «спроектируй и реализуй страницу настроек» — MCP-интеграция вызывает Stitch для генерации UI, а AI-агент реализует его в кодовой базе, без необходимости открывать браузер.

«AI-агенты теперь могут создавать и управлять UI-дизайнами напрямую, а не просто писать код.»

Контекст: взрывной рост Agent Skills

К марту 2026 года более 32 конкурирующих инструментов — Claude Code, Codex CLI, Gemini CLI, Cursor, GitHub Copilot и Google Antigravity — читают одни и те же SKILL.md-файлы.

Anthropic Claude Code стал первой крупной платформой, нативно поддержавшей навыки — в конце 2025 года. Skills стали первоклассными объектами в архитектуре Claude Code с автообнаружением и поддержкой YAML-метаданных. OpenAI Codex принял стандарт в феврале 2026 года, представив навыки как ключевую возможность при запуске приложения Codex.

По состоянию на март 2026 года Agent Skills поддерживаются более чем 16 инструментами, включая Claude Code, Cursor, OpenAI Codex, Gemini CLI, Junie (JetBrains), GitHub Copilot, VS Code, OpenHands и другими.

Значение для отрасли

Выход stitch-skills от Google Labs фиксирует важный сдвиг: крупные вендоры начинают публиковать официальные пакеты навыков для своих продуктов в открытом экосистемном формате. Навык, написанный для Claude Code, может запускаться без изменений в конкурирующем coding-агенте — это наглядный признак того, что стандарт перешёл от фичи одного вендора к общей инфраструктуре.

Для разработчиков, которые уже используют Claude Code или Cursor как основной редактор, подобная интеграция даёт трёх-пятикратный прирост производительности при работе с UI.

Репозиторий доступен по адресу github.com/google-labs-code/stitch-skills. Проект является экспериментальным продуктом Google Labs и не входит в официально поддерживаемые продукты Google.