# Скиллы по теме «Дизайн»

Скиллы по теме «Дизайн»: у каждой карточки — что делает, команда установки и примеры запросов.

2133 карточки · страница 28 из 54

- HTML: https://affpapa.org/nevibecode/skills/topic/design?page=28
- Инструкция для агента: https://affpapa.org/nevibecode/agents.md

- [design-system](https://affpapa.org/nevibecode/skills/builderos-design-system.md) — скилл · BuilderOS · Claude Code, Codex, Cursor +3 · 1800 установок — Собирает дизайн-систему по скриншотам или макетам и записывает её сразу в два файла: docs/design.md для агента и docs/design.html для браузера.
- [blueprinter](https://affpapa.org/nevibecode/skills/blueprinter.md) — скилл · yofine · Claude Code, Codex, Cursor +3 · 974 установки — Скилл создаёт строгие технические схемы и диаграммы на чистом HTML и CSS.
- [swiss-design](https://affpapa.org/nevibecode/skills/swiss-design.md) — скилл · zeke · Claude Code, Codex, Cursor +3 · 951 установка — Скилл задаёт ИИ-агенту дизайн-систему в духе швейцарского интернационального стиля: типографика IBM Plex Sans, сетка, оттенки stone и акцентный цвет.
- [pixel-art-sprites](https://affpapa.org/nevibecode/skills/pixel-art-sprites.md) — скилл · omer-metin · Claude Code, Codex, Cursor +3 · 2700 установок — Настраивает ассистента на отрисовку спрайтов и тайлсетов.
- [algorithm-design](https://affpapa.org/nevibecode/skills/algorithm-design.md) — скилл · lingzhi227 · Claude Code, Codex, Cursor +3 · 1700 установок — Скилл превращает описание метода или реализацию в псевдокод LaTeX и диаграммы Mermaid.
- [paper-cinder-transition](https://affpapa.org/nevibecode/skills/paper-cinder-transition.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 330 установок — Скилл для WebGL-перехода между сценами: линия огня съедает старую страницу и открывает новую.
- [responsive-patterns](https://affpapa.org/nevibecode/skills/responsive-patterns.md) — скилл · OrchestKit · Claude Code, Codex, Cursor +3 · 1600 установок — Скилл внедряет правила адаптивной вёрстки на Container Queries, subgrid и fluid typography в React.
- [craft-design-engineering](https://affpapa.org/nevibecode/skills/craft-design-engineering.md) — скилл · gustavo-fior · Claude Code, Codex, Cursor +3 · 479 установок — Скилл с правилами дизайн-инженерии: типографика, цвет, отступы, анимации и цифры.
- [wireframe](https://affpapa.org/nevibecode/skills/wireframe.md) — скилл · ghaida · Claude Code, Codex, Cursor +3 · 2300 установок — Проектирует структуру экранов: что на них есть, где стоит и что важнее.
- [fire-paper-loader](https://affpapa.org/nevibecode/skills/fire-paper-loader.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 319 установок — Создаёт прелоадер в виде горящей бумаги на WebGL 1 и OffscreenCanvas.
- [brand-visual-generator](https://affpapa.org/nevibecode/skills/brand-visual-generator.md) — скилл · kostja94 · Claude Code, Codex, Cursor +3 · 1400 установок — Скилл помогает задать или проверить визуальную айдентику: шрифты, палитру, отступы, дизайн-токены и эстетику фронтенда.
- [amazon-product-photography](https://affpapa.org/nevibecode/skills/amazon-product-photography.md) — скилл · nexscope-ai · Claude Code, Codex, Cursor +3 · 1200 установок — Превращает данные о товаре в готовый план съёмки: список кадров, брифы для инфографики и лайфстайл-сцен, маршрут производства.
- [design-loop](https://affpapa.org/nevibecode/skills/design-loop.md) — скилл · jezweb · Claude Code, Codex, Cursor +3 · 1000 установок — Скилл ведёт цикл: читает задачу из файла-эстафеты, генерирует страницу в HTML/Tailwind, встраивает её в сайт и пишет следующую задачу.
- [macos-notch-ui](https://affpapa.org/nevibecode/skills/macos-notch-ui.md) — скилл · fayazara · Claude Code, Codex, Cursor +3 · 557 установок — Скилл помогает добавить в приложение macOS панель, которая раскрывается от выреза экрана.
- [mermaidjs-v11](https://affpapa.org/nevibecode/skills/mermaidjs-v11.md) — скилл · mrgoonie · Claude Code, Codex, Cursor +3 · 364 установки — Скилл учит агента писать диаграммы на синтаксисе Mermaid.js v11 и рендерить их в SVG, PNG или PDF.
- [tailwind-css](https://affpapa.org/nevibecode/skills/tailwind-css.md) — скилл · PaulRBerg · Claude Code, Codex, Cursor +3 · 3000 установок — Задаёт правила стилизации Tailwind CSS: запрещает ломать вёрстку старых версий синтаксисом v4, требует проверку сборки и инспекцию DOM.
- [game-designer](https://affpapa.org/nevibecode/skills/game-designer.md) — скилл · OpusGameLabs · Claude Code, Codex, Cursor +3 · 1900 установок — Скилл для геймдизайна: разбирает браузерную игру и доводит её вид — фон, частицы, анимации, переходы между сценами.
- [ui-components](https://affpapa.org/nevibecode/skills/ui-components.md) — скилл · OrchestKit · Claude Code, Codex, Cursor +3 · 1500 установок — Скилл задаёт правила разработки интерфейсов на базе shadcn/ui и Radix Primitives.
- [beautiful-mermaid](https://affpapa.org/nevibecode/skills/beautiful-mermaid.md) — скилл · intellectronica · Claude Code, Codex, Cursor +3 · 1800 установок — Рендерит диаграммы Mermaid в векторные SVG и растровые PNG через библиотеку Beautiful Mermaid.
- [brand-identity](https://affpapa.org/nevibecode/skills/rampstackco-brand-identity.md) — скилл · rampstackco · Claude Code, Codex, Cursor +3 · 499 установок — Скилл для проектирования и проверки визуальной айдентики: логотип, палитра, типографика, иллюстрации, иконки и принципы анимации.
- [ui-craft-dense-dashboard](https://affpapa.org/nevibecode/skills/ui-craft-dense-dashboard.md) — скилл · educlopez · Claude Code, Codex, Cursor +3 · 1200 установок — Задаёт агенту стиль для админок и аналитических панелей: плотная сетка, моноширинные числа, семантические цвета.
- [excalidraw](https://affpapa.org/nevibecode/skills/agents365-ai-excalidraw.md) — скилл · Agents365-ai · Claude Code, Codex, Cursor +3 · 4600 установок — Скилл рисует диаграммы, блок-схемы и схемы архитектуры в файлах .excalidraw и выгружает их в PNG или SVG.
- [excalidraw-skill](https://affpapa.org/nevibecode/skills/excalidraw-skill.md) — скилл · lingzhi227 · Claude Code, Codex, Cursor +3 · 1500 установок — Скилл даёт агенту инструменты для рисования и правки диаграмм Excalidraw на живом канвасе, с экспортом в файлы и картинки.
- [design](https://affpapa.org/nevibecode/skills/rshankras-design.md) — скилл · rshankras · Claude Code, Codex, Cursor +3 · 677 установок — Набор дизайн-скиллов для интерфейсов Apple: Liquid Glass, анимации, игровой отклик, UX-тексты, SF Symbols и типографика.
- [tesseract-design](https://affpapa.org/nevibecode/skills/tesseract-design.md) — скилл · mirage-hq · Claude Code, Codex, Cursor +3 · 1400 установок — Скилл создаёт статичные макеты в Tesseract и выводит их в PNG.
- [om-ux-shape](https://affpapa.org/nevibecode/skills/om-ux-shape.md) — скилл · open-mercato · Claude Code, Codex, Cursor +3 · 2500 установок — Превращает расплывчатую идею фичи или экрана в одно принятое решение: что делаем, для кого и как это выглядит в интерфейсе.
- [om-ux-setup](https://affpapa.org/nevibecode/skills/om-ux-setup.md) — скилл · open-mercato · Claude Code, Codex, Cursor +3 · 2500 установок — Собирает дизайн-систему вашего репозитория в .uxproof/, чтобы UX-скиллы судили код по вашим правилам, а не по встроенным.
- [om-ux-review-pr](https://affpapa.org/nevibecode/skills/om-ux-review-pr.md) — скилл · open-mercato · Claude Code, Codex, Cursor +3 · 2600 установок — Скилл проверяет интерфейс в браузере по изменениям ветки или пулл-реквеста и находит ошибки взаимодействия.
- [logo-design](https://affpapa.org/nevibecode/skills/rampstackco-logo-design.md) — скилл · rampstackco · Claude Code, Codex, Cursor +3 · 447 установок — Скилл генерирует 6–12 вариантов логотипа по разным архитектурам и доводит выбранный до продакшена.
- [sap-fiori-guidelines](https://affpapa.org/nevibecode/skills/sap-fiori-guidelines.md) — скилл · SAP · Claude Code, Codex, Cursor +3 · 1200 установок — Скилл подкладывает агенту официальные правила дизайн-системы SAP Fiori: кнопки, формы, таблицы, страницы, цвета, доступность и паттерны Joule.
- [game-assets](https://affpapa.org/nevibecode/skills/game-assets.md) — скилл · OpusGameLabs · Claude Code, Codex, Cursor +3 · 1600 установок — Скилл рисует пиксель-арт спрайты, анимированных персонажей и предметы для браузерных игр прямо кодом, без внешних картинок.
- [motion-dev-animations](https://affpapa.org/nevibecode/skills/motion-dev-animations.md) — скилл · Motion Dev Standards · Claude Code, Codex, Cursor +3 · 594 установки — Генерирует GPU-анимации на Motion.dev для React, Next.js, Svelte и Astro.
- [brand-yml](https://affpapa.org/nevibecode/skills/brand-yml.md) — скилл · Garrick Aden-Buie (@gadenbuie) · Claude Code, Codex, Cursor +3 · 918 установок — Скилл собирает и правит файлы _brand.yml, чтобы цвета, шрифты и логотипы совпадали в Shiny-приложениях и документах Quarto.
- [Blender](https://affpapa.org/nevibecode/skills/blender.md) — скилл · SFKislev · Claude Code, Codex, Cursor +3 · 2800 установок — Скилл связывает агента с открытым Blender через мост Flue.
- [brand-analyzer](https://affpapa.org/nevibecode/skills/brand-analyzer.md) — скилл · ailabs-393 · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл проводит экспресс-аудит бренда, выявляет архетипы по Юнгу и формирует готовые брендбуки или отчёты с рекомендациями.
- [favicon-generator](https://affpapa.org/nevibecode/skills/favicon-generator.md) — скилл · kostja94 · Claude Code, Codex, Cursor +3 · 1100 установок — Помогает собрать favicon и иконки приложений: размеры, форматы, теги в HTML и требования Google Search.
- [creative-direction](https://affpapa.org/nevibecode/skills/creative-direction.md) — скилл · rampstackco · Claude Code, Codex, Cursor +3 · 419 установок — Скилл формирует эстетический бриф проекта по четырём осям: тональность, визуальная философия, связь с аудиторией и эмоциональная глубина.
- [nanobanana](https://affpapa.org/nevibecode/skills/nanobanana.md) — скилл · GargantuaX · Claude Code, Codex, Cursor +3 · 10600 установок — Генерирует и редактирует изображения через модели Gemini.
- [video-prompting](https://affpapa.org/nevibecode/skills/video-prompting.md) — скилл · Square-Zero-Labs · Claude Code, Codex, Cursor +3 · 602 установки — Составляет точные промпты для генераторов видео и готовит чарактер-шиты под сохранение внешности персонажа при анимации.
- [tldraw-skill](https://affpapa.org/nevibecode/skills/tldraw-skill.md) — скилл · Agents365-ai · Claude Code, Codex, Cursor +3 · 3700 установок — Создаёт схемы в формате .tldr и экспортирует их в PNG или SVG через CLI.

Дальше: https://affpapa.org/nevibecode/skills/topic/design.md?page=29

## Уточнить
[ui](https://affpapa.org/nevibecode/tag/ui.md) · [animation](https://affpapa.org/nevibecode/tag/animation.md) · [css](https://affpapa.org/nevibecode/tag/css.md) · [design-system](https://affpapa.org/nevibecode/tag/design-system.md) · [accessibility](https://affpapa.org/nevibecode/tag/accessibility.md) · [react](https://affpapa.org/nevibecode/tag/react.md) · [ux](https://affpapa.org/nevibecode/tag/ux.md) · [image-generation](https://affpapa.org/nevibecode/tag/image-generation.md) · [tailwind](https://affpapa.org/nevibecode/tag/tailwind.md) · [typography](https://affpapa.org/nevibecode/tag/typography.md) · [html](https://affpapa.org/nevibecode/tag/html.md) · [design-tokens](https://affpapa.org/nevibecode/tag/design-tokens.md)

## Сузить этот список
Параметры: `?platform=<claude-code|codex|cursor|copilot|gemini-cli|windsurf|…>`, `&topic=<…>`, `&sort=installs|stars|new|updated` — значения в https://affpapa.org/nevibecode/agents.md

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md
