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

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

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

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

- [flutter-dev](https://affpapa.org/nevibecode/skills/flutter-dev.md) — скилл · MiniMax-AI · Claude Code, Codex, Cursor +3 · 2000 установок — Гайд для разработки Flutter-приложений с паттернами виджетов, Riverpod, Bloc и GoRouter.
- [uniwind](https://affpapa.org/nevibecode/skills/uniwind.md) — скилл · uni-stack · Claude Code, Codex, Cursor +3 · 4500 установок — Скилл даёт агенту правила и справочники Uniwind, чтобы он собирал и чинил интерфейсы на Tailwind CSS v4 в React Native, а не угадывал API.
- [chat-motion-overlay](https://affpapa.org/nevibecode/skills/chat-motion-overlay.md) — скилл · nexu-io · Claude Code, Codex, Cursor +3 · 829 установок — Создаёт анимированные сцены переписки из текста или скриншота и готовит их для рендера в Remotion.
- [react19-test-patterns](https://affpapa.org/nevibecode/skills/react19-test-patterns.md) — скилл (официальный GitHub) · github · GitHub Copilot · 1200 установок — Подсказывает, как обновить тесты для совместимости с React 19.
- [remotion](https://affpapa.org/nevibecode/skills/vercel-labs-remotion.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 1700 установок — Скилл превращает JSON-описания видеотайм-лайна в готовые видеокомпозиции через Remotion.
- [design-taste-frontend](https://affpapa.org/nevibecode/skills/nexu-io-design-taste-frontend.md) — скилл · nexu-io · Claude Code, Codex, Cursor +3 · 808 установок — Скилл для лендингов, портфолио и редизайнов.
- [audio-and-sound](https://affpapa.org/nevibecode/skills/audio-and-sound.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 944 установки — Помогает настроить воспроизведение звуков, фоновой музыки, громкости и пространственного аудио в играх на Phaser 4 через SoundManager и Web Audio API.
- [write-unit-tests](https://affpapa.org/nevibecode/skills/write-unit-tests.md) — скилл · tldraw · Claude Code, Codex, Cursor +3 · 498 установок — Скилл для написания unit- и интеграционных тестов в репозитории tldraw: подсказывает, где размещать тесты, как работать с TestEditor и какие ловушки Vitest подстерегают.
- [react-native-dev](https://affpapa.org/nevibecode/skills/react-native-dev.md) — скилл · MiniMax-AI · Claude Code, Codex, Cursor +3 · 1900 установок — Справочник по React Native и Expo для агента: навигация, списки, анимации, состояние, тесты и сборка.
- [resource-curator](https://affpapa.org/nevibecode/skills/resource-curator.md) — скилл · leonardomso · Claude Code, Codex, Cursor +3 · 320 установок — Скилл находит, проверяет и упорядочивает учебные материалы для справочников по JavaScript.
- [landing-page-design](https://affpapa.org/nevibecode/skills/elayadesign-landing-page-design.md) — скилл · elayadesign · Claude Code, Codex, Cursor +3 · 1800 установок — Скилл ведёт агента по сборке лендинга: сначала вопросы о продукте и структура страницы, потом жёсткие правила типографики, отступов и фонов.
- [kumo-design](https://affpapa.org/nevibecode/skills/kumo-design.md) — скилл · cloudflare · Claude Code, Codex, Cursor +3 · 1500 установок — Гайд по дизайну интерфейсов Cloudflare: задаёт правила вёрстки для Kumo UI, модальных окон, карточек и типографики в панели управления.
- [tweens](https://affpapa.org/nevibecode/skills/tweens.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 899 установок — Скилл учит ИИ-агентов анимировать свойства объектов в Phaser 4 через TweenManager, цепочки TweenChain и функцию stagger.
- [visual-verdict](https://affpapa.org/nevibecode/skills/visual-verdict.md) — скилл · Yeachan-Heo · Claude Code, Codex, Cursor +3 · 901 установка — Скилл сравнивает полученный скриншот интерфейса с референсными изображениями и возвращает JSON-вердикт для следующей итерации правок.
- [react19-concurrent-patterns](https://affpapa.org/nevibecode/skills/react19-concurrent-patterns.md) — скилл (официальный GitHub) · github · GitHub Copilot · 1100 установок — Защищает concurrent-паттерны React 18 от поломок при миграции на React 19.
- [frontend-developer](https://affpapa.org/nevibecode/skills/frontend-developer.md) — скилл · sickn33 · Claude Code, Codex, Cursor +3 · 1300 установок — Помогает проектировать и писать интерфейсы на React и Next.js с адаптивностью, состоянием и доступностью.
- [radix-ui-design-system](https://affpapa.org/nevibecode/skills/radix-ui-design-system.md) — скилл · sickn33 · Claude Code, Codex, Cursor +3 · 1300 установок — Скилл помогает создавать дизайн-системы и доступные интерфейсные компоненты на базе примитивов Radix UI без готовых стилей.
- [refero-design](https://affpapa.org/nevibecode/skills/refero-design.md) — скилл · referodesign · Claude Code, Codex, Cursor +3 · 12000 установок — Задаёт исследовательский процесс для UI и продуктового дизайна: сначала референсы, затем код.
- [preline-theme-generator](https://affpapa.org/nevibecode/skills/preline-theme-generator.md) — скилл · htmlstreamofficial · Claude Code, Codex, Cursor +3 · 1300 установок — Генерирует CSS-темы для Preline UI из цветов бренда или настроения.
- [visual-edit-precision](https://affpapa.org/nevibecode/skills/visual-edit-precision.md) — скилл · Adit Jain · Claude Code, Codex, Cursor · 2800 установок — Скилл для целевых изменений UI, когда вы показываете элементы на скриншоте или указываете их прямо в коде.
- [image](https://affpapa.org/nevibecode/skills/vercel-labs-image.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 1500 установок — Превращает JSON-спецификации в SVG и PNG через Satori.
- [write-example](https://affpapa.org/nevibecode/skills/write-example.md) — скилл · tldraw · Claude Code, Codex, Cursor +3 · 445 установок — Задаёт правила создания демо-примеров в SDK tldraw: файловую структуру, разметку README.md и каркас компонентов на React.
- [huggingface-gradio](https://affpapa.org/nevibecode/skills/huggingface-gradio.md) — скилл · huggingface · Claude Code, Codex, Cursor +3 · 2300 установок — Скилл помогает создавать и редактировать веб-интерфейсы на Gradio в Python.
- [zustand-5](https://affpapa.org/nevibecode/skills/zustand-5.md) — скилл · prowler-cloud · Claude Code, Codex, Cursor +3 · 911 установок — Скилл с паттернами управления состоянием в Zustand 5: базовые хранилища, селекторы, persist-middleware и разделение логики на слайсы.
- [text-and-bitmaptext](https://affpapa.org/nevibecode/skills/text-and-bitmaptext.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 823 установки — Скилл помогает ИИ-агенту выводить и настраивать текст в Phaser 4.
- [write-e2e-tests](https://affpapa.org/nevibecode/skills/write-e2e-tests.md) — скилл · tldraw · Claude Code, Codex, Cursor +3 · 430 установок — Помогает писать Playwright E2E-тесты для tldraw: действия в интерфейсе, меню и фигуры на холсте.
- [game-object-components](https://affpapa.org/nevibecode/skills/game-object-components.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 800 установок — Справочник по компонентам и миксинам игровых объектов в Phaser 4.
- [control-ui](https://affpapa.org/nevibecode/skills/control-ui.md) — скилл · cursor · Claude Code, Codex, Cursor +3 · 2400 установок — Скилл подключает локальную автоматизацию браузера или CDP для проверки интерфейсов веб-приложений и Electron.
- [time-and-timers](https://affpapa.org/nevibecode/skills/time-and-timers.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 792 установки — Помогает настраивать таймеры, задержки и последовательности Timeline в Phaser 4.
- [react-email](https://affpapa.org/nevibecode/skills/vercel-labs-react-email.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 1400 установок — Преобразует JSON-спецификации в HTML- и текстовые письма через React Email.
- [vue](https://affpapa.org/nevibecode/skills/vercel-labs-vue.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 1400 установок — Скилл для преобразования JSON-спецификаций в Vue 3 компоненты с привязкой данных, условиями видимости и обработкой действий.
- [image-to-ui](https://affpapa.org/nevibecode/skills/image-to-ui.md) — скилл · UIZZE · Claude Code, Codex, Cursor +3 · 63500 установок — Превратите скриншот, макет или эскиз в рабочий код интерфейса.
- [userinterface-wiki](https://affpapa.org/nevibecode/skills/userinterface-wiki.md) — скилл · raphael-salaja · Claude Code, Codex, Cursor +3 · 4500 установок — Справочник из 152 правил UI/UX для веб-интерфейсов.
- [adaptive](https://affpapa.org/nevibecode/skills/adaptive.md) — скилл · Google LLC · Claude Code, Codex, Cursor +3 · 2400 установок — Настраивает адаптивный интерфейс Android-приложений на Jetpack Compose под телефоны, планшеты, складные устройства и десктоп.
- [filters-and-postfx](https://affpapa.org/nevibecode/skills/filters-and-postfx.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 777 установок — Скилл обучает ассистента настройке шейдерных фильтров и постобработки в Phaser 4.
- [react19-source-patterns](https://affpapa.org/nevibecode/skills/react19-source-patterns.md) — скилл (официальный GitHub) · github · GitHub Copilot · 967 установок — Справочник для миграции React-исходников на React 19: API, ref, контекст и пропсы.
- [anti-ui-slop](https://affpapa.org/nevibecode/skills/anti-ui-slop.md) — скилл (официальный GitHub) · UIZZE · GitHub Copilot · 967 установок — Скилл помогает создавать интерфейсы под конкретный продукт, а не собирать шаблонный UI.
- [kill-ai-slop](https://affpapa.org/nevibecode/skills/kill-ai-slop.md) — скилл · yetone · Claude Code, Codex, Cursor +3 · 3200 установок — Скилл находит и убирает визуальные и текстовые штампы, из-за которых сайт выглядит сгенерированным.
- [render-textures](https://affpapa.org/nevibecode/skills/render-textures.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 773 установки — Скилл обучает агента работать с RenderTexture и DynamicTexture в Phaser 4: рисовать объекты в текстуру, использовать Stamp и настраивать командный буфер.
- [physics-matter](https://affpapa.org/nevibecode/skills/physics-matter.md) — скилл · phaserjs · Claude Code, Codex, Cursor +3 · 758 установок — Скилл учит ИИ настраивать физику Matter.js в Phaser 4: твёрдые тела, ограничения, сенсоры и перетаскивание объектов мышью.

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

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