high-end-visual-designAwwwards-уровень визуального дизайна
leonxlnx/taste-skill
Для по-настоящему премиального UI вместо обычного Inter и скруглённых углов. Enforces Awwwards-уровень: чёткие антипаттерны и правила исполнения для каждого решения.
Установка
npx -y skills add leonxlnx/taste-skill --skill high-end-visual-design --agent claude-codeTaste Skill
Anti-Slop Frontend Framework для AI-агентов
Портативные Agent Skills для улучшения AI-интерфейсов: сильнее разметка, типографика, анимация и отступы — вместо шаблонного вида. Также включает скиллы генерации изображений для референс-бордов (веб, мобильные, брендовые киты).
Лицензия: MIT · tasteskill.dev
Установка
Все скиллы
npx skills add https://github.com/Leonxlnx/taste-skillКонкретный скилл по install name
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"Также можно скопировать любой SKILL.md в проект или вставить в разговор с ChatGPT / Codex.
Обновление с предыдущей версии
taste-skill теперь v2 (экспериментальный). Для обновления просто повторно запустите команду установки — install name не изменился. Для закрепления v1:
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend-v1"Скиллы
Каждый скилл делает одну работу. Скиллы реализации выводят код. Скиллы генерации изображений выводят только изображения.
| Папка | Install name | Описание |
|---|---|---|
| taste-skill | design-taste-frontend | v2 (эксп.) — читает бриф, определяет дизайн-язык, настраивает три регулятора: VARIANCE / MOTION / DENSITY |
| taste-skill-v1 | design-taste-frontend-v1 | Оригинальный v1, сохранён для проектов, зависящих от точного поведения |
| gpt-tasteskill | gpt-taste | Строгий вариант для GPT/Codex: более высокая вариативность разметки, агрессивная анти-шаблонность |
| image-to-code-skill | image-to-code | Пайплайн image-first: генерировать референсы → анализировать → реализовать фронтенд |
| redesign-skill | redesign-existing-projects | Для существующих проектов: сначала аудит UI, затем исправление разметки, отступов, иерархии, стиля |
| soft-skill | high-end-visual-design | Отполированный, спокойный, дорогой UI: мягкий контраст, пространство, премиальные шрифты, пружинная анимация |
| output-skill | full-output-enforcement | Когда модель сдаёт незаконченную работу: полный вывод, без placeholder-комментариев |
| minimalist-skill | minimalist-ui | Редакционный продуктовый UI (Notion/Linear), сдержанная палитра, чёткая структура |
| brutalist-skill | industrial-brutalist-ui | Жёсткий механический язык: швейцарская типографика, острый контраст, экспериментальная разметка |
| stitch-skill | stitch-design-taste | Правила совместимые с Google Stitch, включая опциональный формат экспорта DESIGN.md |
Скиллы генерации изображений
| Папка | Install name | Описание |
|---|---|---|
| imagegen-frontend-web | imagegen-frontend-web | Веб-компы: hero, landing, многосекционные с сильной типографикой |
| imagegen-frontend-mobile | imagegen-frontend-mobile | Мобильные экраны: iOS/Android, мокапы, связные наборы |
| brandkit | brandkit | Брендовые борды: направления логотипов, палитры, типографика, применения |
Что выбрать
- taste-skill — самый безопасный универсальный вариант по умолчанию (v2 experimental)
- taste-skill-v1 — если v2 ломает что-то специфичное в рабочем процессе
- gpt-taste — для строгих правил в ориентации на GPT/Codex
- image-to-code-skill — для пайплайна изображение → анализ → код
- redesign-skill — для улучшения существующей кодовой базы
- soft-skill / minimalist-skill / brutalist-skill — когда визуальное направление уже выбрано
- output-skill — если агент постоянно обрезает вывод
Настройки (только taste-skill)
Числа в начале файла — регуляторы от 1 до 10:
- DESIGN_VARIANCE: экспериментальность разметки (ниже: центрированная/чистая · выше: асимметричная/современная)
- MOTION_INTENSITY: глубина анимации (ниже: hover · выше: scroll/магнетизм)
- VISUAL_DENSITY: информация на экран (ниже: просторно · выше: плотные дашборды)
Часто задаваемые вопросы
Чем отличается от других AI-дизайн-скиллов? Несколько специализированных вариантов, регулируемые параметры, анти-повторяющиеся правила на основе специального исследования. Не зависит от конкретного фреймворка.
Работает с React, Vue, Svelte? Да — правила направлены на дизайн-намерение, а не на API конкретного фреймворка.
Устанавливаются ли скиллы генерации изображений через npx skills add? Да — они живут в skills/ наравне с код-скиллами.
Обратная связь
- Pull Request или Issue на GitHub
- DM @lexnlin или @blueemi99
- Email: hello@tasteskill.dev
Лицензия MIT · Copyright (c) 2026 Leonxlnx
Из того же репозитория
design-taste-frontend — базовая дизайн-система для Claude
leonxlnx/taste-skill
Устанавливает три параметра дизайна для Claude: вариативность (асимметрия), интенсивность движения (анимации) и визуальная плотность. База для предсказуемого UI-стиля.
redesign-existing-projects — редизайн шаблонных AI-сайтов
leonxlnx/taste-skill
Аудит существующего кода на шаблонные паттерны (центрированный hero, дефолтные шрифты) и системный редизайн с конкретными правилами и измеримым улучшением.
minimalist-ui — редакционный минимализм UI
leonxlnx/taste-skill
Запрещает AI-клише: Inter/Roboto, Lucide icons, тяжёлые тени и скруглённые углы. Editorial minimalism с конкретными заменами для каждого запрещённого паттерна.
full-output-enforcement — запрет обрезки кода
leonxlnx/taste-skill
Запрещает Claude обрезать код: "// rest of code here", "let me know if you want more" и другие паттерны усечения. Всегда полный вывод без сокращений.