instagram-carousel — скилл для Claude Code: HTML-карусели
Собирает карусель для Instagram как прокручиваемый HTML-превью, а каждый слайд отдаёт готовым PNG 1080×1350.
npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a claude-codeЧто делает instagram-carousel
Скилл ведёт всю цепочку: сначала спрашивает про бренд — название, ник, основной цвет, логотип, шрифт, тон, картинки и язык слайдов. Из одного цвета разворачивает палитру из шести токенов: акцент, светлый и тёмный его оттенки, фон светлых слайдов, разделители и фон тёмных. Шрифты берёт из Google Fonts по таблице стилей — от Playfair Display с DM Sans до Bricolage Grotesque.
Дальше генерирует самодостаточный HTML с прокруткой, а на экспорт гоняет его через Playwright: каждый слайд становится отдельным PNG 1080×1350. Картинки встраиваются в разметку как base64 data: URI. Относительные пути вроде gestante.png ломаются в любом окружении, кроме той же папки, что и HTML, поэтому их скилл не использует. HTML он советует писать через Python Path.write_text(), потому что shell-heredoc подставляет $ и обратные кавычки и портит base64.
Перед генерацией скилл просит детали бренда и не подставляет их сам: если написать «сделай карусель про X» без вводных, он сначала спросит. Формат по умолчанию — стандартная последовательность из 7 слайдов, язык слайдов — португальский (BR), если не указать другой. Экспорт требует Playwright.
Какие задачи решает
- собрать карусель из 7 слайдов под один бренд
- развернуть палитру из одного фирменного цвета
- подобрать пару шрифтов под тон бренда
- встроить фото в слайд без битых путей
- выгрузить каждый слайд в PNG 1080×1350
Примеры запросов агенту
- сделай карусель для Instagram про запуск продукта, бренд и цвета я дам
- собери HTML-превью карусели на 7 слайдов и экспортируй PNG через Playwright
- сделай карусель на португальском, тон — дружелюбный
Как установить instagram-carousel
1Через Skills CLI (Vercel)
npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a claude-code2Вручную: положить файлы
~/.claude/skills/instagram-carousel/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/instagram-carousel/
1Через Skills CLI (Vercel)
npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a codex2Вручную: положить файлы
.agents/skills/instagram-carousel/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a cursor2Вручную: положить файлы
.cursor/skills/instagram-carousel/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install marcolang/Marketing-Skills instagram-carousel2Вручную: положить файлы
.github/skills/instagram-carousel/SKILL.md1Через Skills CLI (Vercel)
npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a gemini-cli2Командой платформы
gemini skills install https://github.com/marcolang/Marketing-Skills --path instagram-carouselВручную: положить файлы
.devin/skills/instagram-carousel/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о instagram-carousel
Как установить instagram-carousel в Claude?
Выполните npx skills add marcolang/Marketing-Skills --skill instagram-carousel -a claude-code. Скилл встанет в ~/.claude/skills/instagram-carousel/SKILL.md.
Что делает instagram-carousel?
Собирает карусель для Instagram в виде прокручиваемого HTML-превью и экспортирует каждый слайд в PNG 1080×1350. По ходу дела настраивает палитру бренда, шрифты и текст слайдов.
Что нужно, чтобы выгрузить слайды?
Экспорт идёт через Playwright, так что он должен быть доступен в окружении. Картинки скилл встраивает как base64 data: URI, а HTML пишет через Python.