taste — скилл для Claude Code: что делает и как установить
Разбирает визуальный стиль веб-страницы через браузер и сохраняет дизайн-токены вместе с логикой интерфейса. Пригодится, когда нужно перенести эстетику чужого проекта в свой код.
npx skills add senlindesign/taste-skill --skill taste -a claude-codeЧто делает taste
Скилл принимает адрес страницы, открывает её через реальный браузер, делает снимок экрана и считывает разметку. Затем генерируются два файла: {domain}.md с разбором стилей и токенов, а также структурированный {domain}.json. Вместо размытых прилагательных скилл выдаёт конкретные сетки, радиусы и цвета в HEX.
Для запуска нужен Playwright MCP сервер. Скилл стартует браузер с флагом изоляции, поэтому куки личного профиля не портят вёрстку публичного сайта. При первом старте загружается пакет Chromium весом около 100 МБ. Это занимает 30–60 секунд.
Инструмент не предназначен для сбора сырых данных со страниц или пересказа текстов. Без настроенного MCP-сервера агент выдаст ошибку и остановится. Это повод проверить статус браузера заранее.
Какие задачи решает
- извлечь дизайн-токены чужого сайта в файл JSON
- зафиксировать правила типографики и отступов интерфейса
- сформулировать визуальные ограничения для ИИ-агента
- разобрать эстетику проекта перед созданием прототипа
Примеры запросов агенту
- /taste <url>
- разбери визуальный стиль страницы по ссылке и выдели палитру
- собери интерфейс в стилистике указанного сайта
Как установить taste
1Через Skills CLI (Vercel)
npx skills add senlindesign/taste-skill --skill taste -a claude-code2Вручную: положить файлы
~/.claude/skills/taste/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/taste/
1Через Skills CLI (Vercel)
npx skills add senlindesign/taste-skill --skill taste -a codex2Вручную: положить файлы
.agents/skills/taste/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add senlindesign/taste-skill --skill taste -a cursor2Вручную: положить файлы
.cursor/skills/taste/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install senlindesign/taste-skill taste2Вручную: положить файлы
.github/skills/taste/SKILL.md1Через Skills CLI (Vercel)
npx skills add senlindesign/taste-skill --skill taste -a gemini-cli2Командой платформы
gemini skills install https://github.com/senlindesign/taste-skillВручную: положить файлы
.devin/skills/taste/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add senlindesign/taste-skill --skill taste -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Похожие
Рядом в теме «Дизайн»
Всё по теме «Дизайн» →Вопросы о taste
Как установить taste в Claude Code?
Выполните команду npx skills add senlindesign/taste-skill --skill taste -a claude-code. Для работы также понадобится подключённый сервер Playwright MCP.
Что делает скилл taste?
Он открывает страницу в Chromium через Playwright, делает снимок экрана и считывает стили разметки. По итогам создаются файл {domain}.md с правилами оформления и структурированный {domain}.json.
Зачем нужен флаг isolated для Playwright?
Флаг --isolated запускает изолированный профиль браузера без сохранённых сессий. Это предотвращает утечку личных куки, чтобы скилл исследовал публичную посадочную страницу, а не закрытую панель аккаунта.
