Garden Skills — коллекция production-ready навыков для Claude Code, Cursor и Codex

Garden Skills — кураторская коллекция production-ready Agent Skills для Claude Code, Cursor, Codex и других AI coding-агентов. Автор — ConardLi, известный в китайском dev-сообществе автор блога Code Secret Garden. Репозиторий собрал 12,4k звёзд на GitHub и распространяется под лицензией MIT.

Коллекция сфокусирована на визуальных и «издательских» задачах: презентации, дизайн интерфейсов, генерация изображений, работа с локальными базами знаний и сборка красивых статей. Все пять навыков следуют открытой спецификации SKILL.md от Anthropic и переносимы между агентами — достаточно скопировать папку в каталог, который сканирует ваш агент.

Что внутри коллекции

На текущий момент коллекция насчитывает пять навыков.

web-video-presentation

Категория: веб-видео и презентации. Превращает сценарии, статьи, уроки и демо продуктов в клик-управляемые 16:9 веб-презентации на Vite + React + TypeScript, которые можно записать с экрана как видео.

Ключевые особенности:

• фиксированная сцена 1920×1080, масштабируемая под вьюпорт — для стабильной записи экрана;
• курсор (chapter, step), управляемый кликами и клавиатурой: один визуальный шаг — один «бит» повествования;
• жёсткие чекпоинты согласования: сценарий, тема, структура, режим реализации, опциональная озвучка;
• скрытые hover-контролы прогресса, чтобы сцена оставалась чистой при записи;
• 23 встроенные темы на архитектуре theme-токенов — от editorial и terminal до Swiss International;
• подключаемый TTS: из коробки два провайдера (MiniMax mmx-cli и OpenAI TTS через curl), плюс контракт и готовые сниппеты для ElevenLabs, edge-tts, Azure, Google Cloud и macOS say.

web-design-engineer

Категория: дизайн и фронтенд. Превращает AI-генерированные веб-артефакты из «просто работающих» в выразительные и продуманные. Навык вдохновлён системным промптом Claude Design из Anthropic Labs — оригинал сохранён в репозитории в dist/prompt/claude-design-system-prompt.md.

Ключевые особенности:

• перевод брифа в пятипараметрический Design Read: variance, motion, density, asset dependence, brand fidelity;
• различение режимов редизайна — extension, preserve или overhaul — до того, как менять существующий продукт;
• блоклист анти-клише против типовых «AI-паттернов» интерфейсов;
• Design Direction Advisor с шестью школами дизайна и 25 стилевых рецептов (Linear, Aesop, Pentagram, Bloomberg, Stripe Press, Mid-Century и другие) — каждый с конкретной палитрой, типографикой и анти-паттернами;
• практические правила реализации: inline React + Babel, CSS-токены, работа с цветом через oklch(), container queries, reduced-motion;
• расширенный справочник паттернов: device frames, слайд-движки, таймлайны анимаций, дашборды.

gpt-image-2

Категория: генерация изображений и промпт-инженерия. Навык для GPT Image 2 и OpenAI-совместимых image API: постеры, UI-мокапы, инфографика, технические диаграммы, сториборды, брендинг.

Ключевые особенности:

• три режима выполнения: Mode A — локальная генерация в Garden, Mode B — делегирование нативному инструменту хоста, Mode C — режим советника, когда инструменты генерации недоступны;
• детекция режима в начале каждой задачи, чтобы навык не выбирал неверный путь выполнения;
• 18 визуальных категорий и 79 структурированных промпт-шаблонов в references/;
• отдельные workflow и скрипты для генерации и редактирования изображений;
• промпты и результаты сохраняются в garden-gpt-image-2/ для повторного использования и версионирования.

У навыка есть публичная галерея из 160+ кейсов на gpt-image2.mmh1.top — от замены фона на портрете до архитектурной диаграммы multi-tenant AI SaaS.

kb-retriever

Категория: ретривал по локальной базе знаний. Отвечает на вопросы из локального каталога knowledge/ и извлекает факты из Markdown, текста, PDF и Excel, не затопляя контекст агента.

Ключевые особенности:

• навигация по многослойным индексным файлам data_structure.md до поиска по содержимому;
• правило «learn-before-process» для PDF и Excel: сначала изучить приложенные справочные документы, потом извлекать данные;
• комбинирует точный поиск по ключевым словам, локальное чтение окон, синонимы и итеративное уточнение;
• жёсткое ограничение — не более 5 раундов поиска, чтобы исследование оставалось управляемым;
• готовые workflow для grep, pdftotext, pdfplumber и pandas с форматированием ответов со ссылками на источники.

beautiful-article

Категория: редактура. Превращает любой источник — URL, PDF, DOCX, Markdown, скриншоты, заметки — в вылизанную статью, которую удобно читать, шарить и архивировать. Результат — самодостаточный HTML-файл (опционально PDF), но фокус именно на статье, а не на «сделать веб-страницу».

Ключевые особенности:

• конвейер source → plan → double-confirmation → build → final review → repair с тремя жёсткими чекпоинтами, где пользователь сохраняет контроль над типом статьи, темой, вёрсткой и обложкой;
• протокол компонентов Reacticle: семантические компоненты Hero / Lead / Section / Quote / Callout / Formula / CodeBlock; React-библиотека живёт в отдельном репозитории ConardLi/reacticle;
• 10 типов статей с коэффициентами сохранения контента — от longform (~100%) до interactive-explainer (~25% выжимки + 75% AI-пересборки);
• 11 авторских тематических профилей (tufte, press, bayer, bodoni, vignelli, sottsass и другие) — каждый является Markdown-контрактом для агента, а не CSS-файлом;
• обложка в пропорции 3:4 в стиле книги, оглавление включено по умолчанию, языкозависимый шаг перевода;
• протокол качества на уровне узлов: inline-проверки основного агента плюс суб-агенты-ревьюеры для первого разворота, секций и финальной вычитки.

Установка

Поддерживается пять способов установки — от одной строки до полностью зафиксированных версий для CI.

Самый быстрый путь — стандартный skills CLI, который сам определяет ваш агент (Claude Code, Cursor, Codex и так далее) и кладёт навык в нужный каталог:

# Установить все навыки (последние версии)
npx skills add ConardLi/garden-skills

# Установить один навык
npx skills add ConardLi/garden-skills -s web-design-engineer

# Глобально (~/.skills) вместо per-project (./.skills)
npx skills add ConardLi/garden-skills -s gpt-image-2 --global

# Указать конкретного агента
npx skills add ConardLi/garden-skills -s kb-retriever -a claude-code

Для пользователей Claude Code есть плагин-маркетплейс с готовыми пакетами:

/plugin marketplace add ConardLi/garden-skills
/plugin install web-design-skills@garden-skills

Пакеты: presentation-skills, web-design-skills, knowledge-base-skills, image-generation-skills.

Для CI и air-gapped-сред каждый релиз публикует неизменяемый .zip с SHA-256 чекsum в GitHub Releases:

SKILL=web-design-engineer
VERSION=1.3.0

curl -fsSL -o "${SKILL}.zip" \
  "https://github.com/ConardLi/garden-skills/releases/download/${SKILL}-v${VERSION}/${SKILL}-${VERSION}.zip"

shasum -a 256 -c "${SKILL}.zip.sha256"
unzip -q "${SKILL}.zip" -d .claude/skills/

Оставшиеся два способа — ручное копирование папки навыка после git clone (удобно для форков и доработок) и git submodule для вендоринга в крупный проект с привязкой к конкретному SHA.

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

Формат SKILL.md портативен по дизайну — агента достаточно поддерживает каталог навыков:

Как устроен скилл

Навык — это самодостаточная папка, которую агент загружает по требованию:

<skill-name>/
├── SKILL.md      ← обязателен: когда применять и как
├── README.md     ← документация для человека
├── references/   ← расширенные доки, загружаются по требованию
├── scripts/      ← детерминированные исполняемые хелперы
└── assets/       ← шаблоны, шрифты, иконки

Агент решает, активировать ли навык, по строке description из YAML frontmatter — по сути это контракт между вами и агентом. Полная спецификация описана на agentskills.io, эталонная коллекция — в репозитории anthropics/skills.

Итог

Garden Skills — редкий пример коллекции навыков, где каждая единица доведена до продакшен-уровня: с версиями, релизами, чекsum и CI-валидацией. Если вам нужно быстро получить достойный фронтенд из AI, записать видео-презентацию или превратить документ в красивую статью — это один из самых зрелых наборов в экосистеме. Автор ориентируется на сообщество: баг-репорты, новые навыки и улучшения тулинга приветствуются, а для дальнейшего поиска стоит взглянуть на awesome-claude-skills и obra/superpowers.