# Скиллы по теме «Фронтенд и UI»

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

2909 карточек · страница 11 из 73

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

- [cookie-debugging](https://affpapa.org/nevibecode/skills/cookie-debugging.md) — скилл · ChromeDevTools · Claude Code, Codex, Cursor +3 · 870 установок — Скилл для инспекции кук, сессий и ошибок аутентификации через Chrome DevTools MCP.
- [extract-design](https://affpapa.org/nevibecode/skills/extract-design.md) — скилл · Manavarya09 · Claude Code, Codex, Cursor +3 · 2900 установок — Скилл анализирует сайт по URL и собирает его дизайн-систему в файлы для разработки и дизайна.
- [ffmpeg](https://affpapa.org/nevibecode/skills/ffmpeg.md) — скилл · digitalsamba · Claude Code, Codex, Cursor +3 · 11700 установок — Готовые команды FFmpeg для конвертации, сжатия, обрезки видео и подготовки ассетов к проектам на Remotion.
- [remotion](https://affpapa.org/nevibecode/skills/calesthio-remotion.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1200 установок — Скилл для вёрстки видео в Remotion с библиотекой переходов и правилами сборки сцен при 30 кадрах в секунду.
- [react-native](https://affpapa.org/nevibecode/skills/react-native.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 3200 установок — Скилл помогает собирать нативные React Native-интерфейсы из JSON-спецификаций.
- [uizze-ui](https://affpapa.org/nevibecode/skills/uizze-ui.md) — скилл · UIZZE · Claude Code, Codex, Cursor +3 · 144000 установок — Направляет агента при вёрстке интерфейсов, исправлении сетки и проверке состояний экрана.
- [ui](https://affpapa.org/nevibecode/skills/tw93-ui.md) — скилл · tw93 · Claude Code, Codex, Cursor +3 · 4300 установок — Скилл помогает собирать и дорабатывать интерфейсы с выразительной визуальной системой и проверкой по скриншотам.
- [material-ui-tailwind](https://affpapa.org/nevibecode/skills/material-ui-tailwind.md) — скилл · mui · Claude Code, Codex, Cursor +3 · 365 установок — Скилл помогает настроить Material UI вместе с Tailwind CSS и разобраться с порядком CSS-слоёв, классами компонентов и миграцией с Tailwind v3.
- [frontend-design](https://affpapa.org/nevibecode/skills/sickn33-frontend-design.md) — скилл · sickn33 · Claude Code, Codex, Cursor +3 · 2600 установок — Учит агента создавать запоминающийся интерфейс вместо шаблонных макетов: выбирает эстетику, проверяет доступность и пишет чистый код.
- [design-guide](https://affpapa.org/nevibecode/skills/design-guide.md) — скилл · paperclipai · Claude Code, Codex, Cursor +3 · 366 установок — Скилл задаёт правила Paperclip для UI-компонентов, токенов, типографики и статусов.
- [hairline-create](https://affpapa.org/nevibecode/skills/hairline-create.md) — скилл · lucasmarkes · Claude Code, Codex, Cursor +3 · 5200 установок — Генерирует интерактивную изометрическую векторную фигуру в стиле движка Hairline и упаковывает её в один автономный HTML-файл.
- [fullstack-dev](https://affpapa.org/nevibecode/skills/fullstack-dev.md) — скилл · MiniMax-AI · Claude Code, Codex, Cursor +3 · 3400 установок — Пошаговый регламент для создания фулстек-приложений и интеграции бекенда с фронтендом.
- [lottie-bodymovin](https://affpapa.org/nevibecode/skills/lottie-bodymovin.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Помогает переносить 12 принципов диснеевской анимации в векторные Lottie-ролики.
- [visual-style](https://affpapa.org/nevibecode/skills/visual-style.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Создаёт, извлекает и переносит дизайн-системы через файлы visual-style.md.
- [remotion-best-practices](https://affpapa.org/nevibecode/skills/vercel-labs-remotion-best-practices.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 1500 установок — Скилл подсказывает агенту, как работать с Remotion в React: от анимации и звука до композиций и параметров видео.
- [paseo-plugin](https://affpapa.org/nevibecode/skills/paseo-plugin.md) — скилл · getpaseo · Claude Code, Codex, Cursor +3 · 1400 установок — Скилл помогает создавать и настраивать локальные плагины для Paseo: от интерфейсных панелей и слэш-команд до RPC и хуков жизненного цикла агентов.
- [gpui-kit](https://affpapa.org/nevibecode/skills/gpui-kit.md) — скилл · longbridge · Claude Code, Codex, Cursor +3 · 1000 установок — Скилл обучает ИИ-агентов правилам разработки десктопных приложений на Rust через крейт gpui-kit.
- [frontend-dev](https://affpapa.org/nevibecode/skills/frontend-dev.md) — скилл · MiniMax-AI · Claude Code, Codex, Cursor +3 · 3200 установок — Скилл проектирует страницы с анимациями, медиафайлами от MiniMax и готовым текстом.
- [audit-website](https://affpapa.org/nevibecode/skills/audit-website.md) — скилл · squirrelscan · Claude Code, Codex, Cursor +3 · 73900 установок — Запускает аудит сайта через утилиту squirrel, находит проблемы SEO, производительности и безопасности, а затем помогает пошагово править код проекта.
- [inspector-docs](https://affpapa.org/nevibecode/skills/inspector-docs.md) — скилл · CopilotKit · Claude Code, Codex, Cursor +3 · 1100 установок — Связывает документацию CopilotKit с рабочими панелями оверлея Inspector.
- [native-sdk](https://affpapa.org/nevibecode/skills/native-sdk.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 1500 установок — Скилл помогает ИИ-агенту создавать десктопные приложения через Native SDK на TypeScript и разметке .native.
- [senior-fullstack](https://affpapa.org/nevibecode/skills/sickn33-senior-fullstack.md) — скилл · sickn33 · Claude Code, Codex, Cursor +3 · 2300 установок — Скилл направляет реализацию фич, которые затрагивают интерфейс, backend, базу данных и deployment.
- [javascript-pro](https://affpapa.org/nevibecode/skills/httpsgithubcomjeffallan-javascript-pro.md) — скилл · https://github.com/Jeffallan · Claude Code, Codex, Cursor +3 · 6100 установок — Скилл для написания, отладки и рефакторинга JavaScript кода с ES2023+, async/await, ESM модулями и Node.js API.
- [gpui-kit-design-guides](https://affpapa.org/nevibecode/skills/gpui-kit-design-guides.md) — скилл · longbridge · Claude Code, Codex, Cursor +3 · 987 установок — Скилл передаёт агенту обязательные правила дизайна десктопных приложений на GPUI Kit.
- [threejs-textures](https://affpapa.org/nevibecode/skills/calesthio-threejs-textures.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1000 установок — Скилл для работы с текстурами Three.js: загрузка изображений, UV-координаты, кубмапы, HDR-среды и оптимизация.
- [threejs-interaction](https://affpapa.org/nevibecode/skills/calesthio-threejs-interaction.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Набор готовых инструкций по настройке raycasting, контроллеров камеры и событий мыши или тачскрина в Three.js.
- [threejs-geometry](https://affpapa.org/nevibecode/skills/calesthio-threejs-geometry.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Сборник шаблонов для создания сеток и геометрии в Three.js.
- [threejs-postprocessing](https://affpapa.org/nevibecode/skills/calesthio-threejs-postprocessing.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл помогает агенту добавлять в Three.js постобработку: свечение, размытие, глубину резкости и экранные эффекты.
- [threejs-loaders](https://affpapa.org/nevibecode/skills/calesthio-threejs-loaders.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл для работы с Three.js: загружает GLTF-модели, текстуры, HDR-среды и управляет прогрессом загрузки через LoadingManager.
- [threejs-materials](https://affpapa.org/nevibecode/skills/calesthio-threejs-materials.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Справочник по материалам Three.js: PBR, базовые, фонговские, кастомные шейдеры.
- [threejs-animation](https://affpapa.org/nevibecode/skills/calesthio-threejs-animation.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл помогает агенту работать с анимацией в Three.js: ключевыми кадрами, костями, morph targets и смешиванием клипов.
- [threejs-lighting](https://affpapa.org/nevibecode/skills/calesthio-threejs-lighting.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Набор инструкций по настройке источников света и теней в Three.js.
- [threejs-fundamentals](https://affpapa.org/nevibecode/skills/calesthio-threejs-fundamentals.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл помогает собирать Three.js-сцены, настраивать камеры и рендерер, а также управлять иерархией объектов и трансформациями.
- [threejs-shaders](https://affpapa.org/nevibecode/skills/calesthio-threejs-shaders.md) — скилл · calesthio · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл помогает писать шейдеры для Three.js: менять вершины, собирать фрагментные эффекты и расширять материалы.
- [sketch](https://affpapa.org/nevibecode/skills/hermes-agent-adapted-from-gsd-sketch.md) — скилл · Hermes Agent (adapted from gsd-build/get-shit-done) · Claude Code, Codex, Cursor +3 · 403 установки — Создаёт 2–3 HTML-варианта интерфейса, чтобы сравнить дизайн-направления до того, как начнёшь строить продакшн-код.
- [better-icons](https://affpapa.org/nevibecode/skills/better-icons.md) — скилл · better-auth · Claude Code, Codex, Cursor +3 · 5900 установок — Ищет векторные значки в 200 каталогах через Iconify и скачивает SVG прямо из терминала или через вызовы агента.
- [unit-test-vue-pinia](https://affpapa.org/nevibecode/skills/unit-test-vue-pinia.md) — скилл (официальный GitHub) · github · GitHub Copilot · 1800 установок — Помогает писать и проверять юнит-тесты для Vue 3, TypeScript, Vitest и Pinia.
- [nextjs-developer](https://affpapa.org/nevibecode/skills/nextjs-developer.md) — скилл · https://github.com/Jeffallan · Claude Code, Codex, Cursor +3 · 5800 установок — Скилл настраивает архитектуру приложений на Next.js 14+ с App Router, серверными компонентами и Server Actions.
- [logo-generator](https://affpapa.org/nevibecode/skills/logo-generator.md) — скилл · op7418 · Claude Code, Codex, Cursor +3 · 3900 установок — Создаёт SVG-логотипы с минимум шестью вариантами дизайна и формирует презентационные изображения с 12 профессиональными фонами через Gemini API.
- [superdesign](https://affpapa.org/nevibecode/skills/superdesign.md) — скилл · superdesigndev · Claude Code, Codex, Cursor +3 · 11200 установок — Создаёт и дорабатывает интерфейсы, презентации и графику на холсте Superdesign.

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

## Уточнить
[react](https://affpapa.org/nevibecode/tag/react.md) · [ui](https://affpapa.org/nevibecode/tag/ui.md) · [typescript](https://affpapa.org/nevibecode/tag/typescript.md) · [css](https://affpapa.org/nevibecode/tag/css.md) · [animation](https://affpapa.org/nevibecode/tag/animation.md) · [accessibility](https://affpapa.org/nevibecode/tag/accessibility.md) · [design-system](https://affpapa.org/nevibecode/tag/design-system.md) · [nextjs](https://affpapa.org/nevibecode/tag/nextjs.md) · [tailwind](https://affpapa.org/nevibecode/tag/tailwind.md) · [javascript](https://affpapa.org/nevibecode/tag/javascript.md) · [webgl](https://affpapa.org/nevibecode/tag/webgl.md) · [typography](https://affpapa.org/nevibecode/tag/typography.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
