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

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

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

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

- [frontend-ui-engineering](https://affpapa.org/nevibecode/skills/frontend-ui-engineering.md) — скилл · addyosmani · Claude Code, Codex, Cursor +3 · 67400 установок — Скилл задаёт правила для доступных адаптивных интерфейсов и компонентов.
- [api-and-interface-design](https://affpapa.org/nevibecode/skills/api-and-interface-design.md) — скилл · addyosmani · Claude Code, Codex, Cursor +3 · 62600 установок — Помогает проектировать API и границы модулей так, чтобы их было проще использовать и менять.
- [mobile-native](https://affpapa.org/nevibecode/skills/mobile-native.md) — скилл · emilkowalski · Claude Code, Codex, Cursor +3 · 86600 установок — Убирает мелочи, из-за которых веб-приложение на телефоне выдаёт себя: залипающий hover, вспышку при тапе, ошибку с 100vh.
- [ppt-master](https://affpapa.org/nevibecode/skills/ppt-master.md) — скилл · hugohe3 · Claude Code, Codex, Cursor +3 · 19900 установок — Скилл создаёт и редактирует презентации PPTX, восстанавливает визуал слайдов и заполняет нативные шаблоны.
- [diagram-design](https://affpapa.org/nevibecode/skills/diagram-design.md) — скилл · cathrynlavery · Claude Code, Codex, Cursor +3 · 19600 установок — Скилл рисует 45 типов диаграмм как самодостаточные HTML-файлы с inline SVG.
- [image](https://affpapa.org/nevibecode/skills/image.md) — скилл · coreyhaines31 · Claude Code, Codex, Cursor +3 · 87800 установок — Скилл для маркетинговых изображений: генерация через ИИ, правка готовых картинок, подбор инструмента и оптимизация под веб.
- [design-md](https://affpapa.org/nevibecode/skills/design-md.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 64800 установок — Скилл выгружает экраны из Google Stitch через MCP-сервер и собирает файл DESIGN.md с описанием дизайн-системы, цветов и компонентов.
- [paywalls](https://affpapa.org/nevibecode/skills/paywalls.md) — скилл · coreyhaines31 · Claude Code, Codex, Cursor +3 · 71000 установок — Скилл помогает проектировать и улучшать экран оплаты, апгрейд, upsell-модалку и ограничения функций.
- [popups](https://affpapa.org/nevibecode/skills/popups.md) — скилл · coreyhaines31 · Claude Code, Codex, Cursor +3 · 70900 установок — Скилл помогает проектировать конвертящие попапы, баннеры и оверлеи без назойливости для пользователей.
- [enhance-prompt](https://affpapa.org/nevibecode/skills/enhance-prompt.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 58300 установок — Превращает неточные идеи интерфейса в детальные промпты для Google Stitch.
- [stitch-loop](https://affpapa.org/nevibecode/skills/stitch-loop.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 56400 установок — Организует автономную сборку страниц через Stitch MCP.
- [remotion-markup](https://affpapa.org/nevibecode/skills/remotion-dev-remotion-markup.md) — скилл · remotion-dev · Claude Code, Codex, Cursor +3 · 207700 установок — Скилл задаёт правила написания React-разметки для Remotion: анимации через кадры, работа с медиа и эффектами.
- [gsap-core](https://affpapa.org/nevibecode/skills/gsap-core.md) — скилл · greensock · Claude Code, Codex, Cursor +3 · 75800 установок — Скилл объясняет и пишет базовые GSAP-анимации для DOM и SVG.
- [stitch::react-components](https://affpapa.org/nevibecode/skills/stitchreact-components.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 50400 установок — Превращает дизайны Stitch в компоненты React с Vite.
- [gsap-scrolltrigger](https://affpapa.org/nevibecode/skills/gsap-scrolltrigger.md) — скилл · greensock · Claude Code, Codex, Cursor +3 · 72800 установок — Обучает ИИ-агента писать анимации по скроллу с плагином ScrollTrigger от GreenSock: закреплять секции и связывать таймлайны с прокруткой через scrub.
- [gsap-timeline](https://affpapa.org/nevibecode/skills/gsap-timeline.md) — скилл · greensock · Claude Code, Codex, Cursor +3 · 69700 установок — Скилл помогает собирать последовательности GSAP-анимаций, управлять таймингом и воспроизведением.
- [gsap-plugins](https://affpapa.org/nevibecode/skills/gsap-plugins.md) — скилл · greensock · Claude Code, Codex, Cursor +3 · 67700 установок — Скилл объясняет, как подключать и использовать плагины GSAP: ScrollTo, Flip, Draggable, SplitText и другие.
- [gsap-react](https://affpapa.org/nevibecode/skills/gsap-react.md) — скилл · greensock · Claude Code, Codex, Cursor +3 · 66900 установок — Скилл подсказывает, как создавать анимации GSAP в React и Next.js, ограничивать их область действия и очищать при размонтировании компонента.
- [remotion-studio](https://affpapa.org/nevibecode/skills/remotion-dev-remotion-studio.md) — скилл · remotion-dev · Claude Code, Codex, Cursor +3 · 177200 установок — Скилл запускает Remotion Studio и открывает предпросмотр видео.
- [animation-performance](https://affpapa.org/nevibecode/skills/animation-performance.md) — скилл · emilkowalski · Claude Code, Codex, Cursor +3 · 36800 установок — Диагностический скилл, который ищет причину пропущенных кадров в веб-анимациях и подсказывает, какой свойство анимировать вместо дорогого.
- [gsap-utils](https://affpapa.org/nevibecode/skills/gsap-utils.md) — скилл · greensock · Claude Code, Codex, Cursor +3 · 65700 установок — Скилл помогает агенту работать с утилитами gsap.utils: диапазонами, случайными значениями, привязкой к шагу и коллекциями.
- [daisyui](https://affpapa.org/nevibecode/skills/daisyui.md) — скилл · saadeghi · Claude Code, Codex, Cursor +3 · 12100 установок — Скилл подключает к ИИ-агенту справочник компонентов daisyUI 5, чтобы тот писал разметку на готовых классах, а не выдумывал свои.
- [remotion](https://affpapa.org/nevibecode/skills/remotion.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 41400 установок — Собирает экраны проекта Stitch в ролик на Remotion с переходами, приближением и текстовыми подписями.
- [anatomy](https://affpapa.org/nevibecode/skills/anatomy.md) — скилл · wheresryan22 · Claude Code, Codex, Cursor +3 · 21800 установок — Генерирует детальные интерактивные изометрические SVG-иллюстрации в виде физических приборов вместо абстрактных схем.
- [make-interfaces-feel-better](https://affpapa.org/nevibecode/skills/make-interfaces-feel-better.md) — скилл · jakubkrehel · Claude Code, Codex, Cursor +3 · 73400 установок — Скилл помогает доводить детали интерфейса: от радиусов и иконок до анимаций.
- [gifgrep](https://affpapa.org/nevibecode/skills/gifgrep.md) — скилл · openclaw · Claude Code, Codex, Cursor +3 · 5200 установок — Поиск гифок в Tenor и Giphy прямо из терминала, скачивание файлов и нарезка раскадровок в PNG для документации или пулреквестов.
- [baoyu-image-gen](https://affpapa.org/nevibecode/skills/baoyu-image-gen.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 33600 установок — Генерация картинок через API OpenAI, Google, DashScope и других сервисов из агента.
- [fireworks-tech-graph](https://affpapa.org/nevibecode/skills/fireworks-tech-graph.md) — скилл · yizhiyanhua-ai · Claude Code, Codex, Cursor +3 · 18000 установок — Генерирует точные технические схемы в SVG, экспортирует их в PNG или автономный HTML и анимирует в GIF.
- [baoyu-infographic](https://affpapa.org/nevibecode/skills/baoyu-infographic.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 32800 установок — Скилл собирает инфографику из вашего текста: выбирает раскладку и стиль, пишет промпт и рендерит картинку.
- [baoyu-cover-image](https://affpapa.org/nevibecode/skills/baoyu-cover-image.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 32100 установок — Скилл рисует обложку для статьи по пяти параметрам: тип, палитра, техника, текст и настроение.
- [excalidraw-diagram-generator](https://affpapa.org/nevibecode/skills/excalidraw-diagram-generator.md) — скилл (официальный GitHub) · github · GitHub Copilot · 31639 установок — Скилл превращает описание на обычном языке в диаграмму Excalidraw.
- [baoyu-article-illustrator](https://affpapa.org/nevibecode/skills/baoyu-article-illustrator.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 31900 установок — Анализирует текст статьи, выбирает места для картинок и готовит иллюстрации в едином стиле.
- [baoyu-xhs-images](https://affpapa.org/nevibecode/skills/baoyu-xhs-images.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 31300 установок — Разбивает статью или пост на серию карточек-картинок в мультяшном стиле.
- [baoyu-slide-deck](https://affpapa.org/nevibecode/skills/baoyu-slide-deck.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 31200 установок — Превращает текст в набор изображений слайдов: сначала план со стилем, потом отдельные PNG.
- [interface-design](https://affpapa.org/nevibecode/skills/interface-design.md) — скилл · Dammyjay93 · Claude Code, Codex, Cursor +3 · 30800 установок — Скилл помогает проектировать и проверять интерфейсы продуктов: дашборды, админки, SaaS-приложения и инструменты.
- [taste-design](https://affpapa.org/nevibecode/skills/taste-design.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 20200 установок — Скилл формирует файл DESIGN.md для Google Stitch, задавая строгие дизайн-правила против шаблонных интерфейсов.
- [baoyu-compress-image](https://affpapa.org/nevibecode/skills/baoyu-compress-image.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 28200 установок — Сжимает изображения в WebP или PNG через системные утилиты вроде sips и cwebp.
- [tailwind-design-system](https://affpapa.org/nevibecode/skills/tailwind-design-system.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 70180 установок — Помогает строить дизайн-системы на Tailwind CSS v4.
- [frost-sequence-camera-orbit](https://affpapa.org/nevibecode/skills/frost-sequence-camera-orbit.md) — скилл · heygen-com · Claude Code, Codex, Cursor +3 · 10000 установок — Скилл собирает 22.5-секундную сцену: камера облетает ледяной логотип, он рассыпается, собирается в два текста и растворяется.
- [orbit-card](https://affpapa.org/nevibecode/skills/orbit-card.md) — скилл · heygen-com · Claude Code, Codex, Cursor +3 · 10000 установок — Скилл для встраивания готового 10-секундного 3D-блока HyperFrames: карточка фичи облетает сферу из точек по траектории камеры из Blender.

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

## Уточнить
[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
