# Скиллы по теме «Фронтенд и UI» Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов. 2909 карточек · страница 7 из 73 - HTML: https://affpapa.org/nevibecode/skills/topic/frontend?page=7 - Инструкция для агента: https://affpapa.org/nevibecode/agents.md - [devtools](https://affpapa.org/nevibecode/skills/devtools.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 8300 установок — Панель отладки для json-render: дерево компонентов, редактор состояния, лог действий, стриминг патчей и пикер элементов. - [react-state-management](https://affpapa.org/nevibecode/skills/react-state-management.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 15286 установок — Помогает выбрать и настроить управление состоянием в React: локальное, глобальное, серверное, URL и состояние форм. - [chakra-ui-migrate](https://affpapa.org/nevibecode/skills/chakra-ui-migrate.md) — скилл · chakra-ui · Claude Code, Codex, Cursor +3 · 1800 установок — Скилл ведёт миграцию проекта с Chakra UI v2 на v3 по шагам. - [react-native-architecture](https://affpapa.org/nevibecode/skills/react-native-architecture.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 15087 установок — Скилл для Claude Code, Codex и Cursor: подсказывает структуру проекта, навигацию, нативные модули и офлайн-синхронизацию в React Native на Expo. - [web-design-guidelines](https://affpapa.org/nevibecode/skills/vercel-web-design-guidelines.md) — скилл · vercel · Claude Code, Codex, Cursor +3 · 3900 установок — Проверяет код интерфейса на соответствие стандартам Vercel: вёрстку, типографику, цвета, анимации и доступность. - [winui3-migration-guide](https://affpapa.org/nevibecode/skills/winui3-migration-guide.md) — скилл (официальный GitHub) · github · GitHub Copilot · 5700 установок — Скилл помогает переносить UWP-код на WinUI 3 и Windows App SDK. - [directives](https://affpapa.org/nevibecode/skills/directives.md) — скилл · vercel-labs · Claude Code, Codex, Cursor +3 · 8000 установок — Готовые директивы для json-render: форматирование, математика, строки, i18n. - [accessibility-compliance](https://affpapa.org/nevibecode/skills/accessibility-compliance.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 14596 установок — Скилл помогает проверять доступность интерфейсов и исправлять проблемы с клавиатурной навигацией, экранными дикторами и формами. - [typescript-review](https://affpapa.org/nevibecode/skills/typescript-review.md) — скилл · metabase · Claude Code, Codex, Cursor +3 · 2300 установок — Проверяет изменения в TypeScript и JavaScript по правилам Metabase. - [site-md](https://affpapa.org/nevibecode/skills/site-md.md) — скилл (официальный Google) · google-labs-code · Claude Code, Codex, Cursor +3 · 3700 установок — Скилл разбирает бриф или описание проекта и формирует файл .stitch/SITE.md для рабочего цикла Stitch Build Loop. - [ima-sdk-client-side](https://affpapa.org/nevibecode/skills/ima-sdk-client-side.md) — скилл (официальный Google) · Google LLC · Claude Code, Gemini CLI, Codex · 4500 установок — Скилл помогает подключать Google IMA SDK для клиентской вставки видео- и аудиорекламы по VAST или VMAP. - [reference-core](https://affpapa.org/nevibecode/skills/reference-core.md) — скилл · angular · Claude Code, Codex, Cursor +3 · 986 установок — Объясняет архитектуру рантайма Angular в packages/core. - [nextjs-supabase-auth](https://affpapa.org/nevibecode/skills/sickn33-nextjs-supabase-auth.md) — скилл · sickn33 · Claude Code, Codex, Cursor +3 · 6600 установок — Скилл настраивает Supabase Auth в Next.js App Router: клиенты, middleware, OAuth callback и Server Actions. - [e2e-tests-studio](https://affpapa.org/nevibecode/skills/e2e-tests-studio.md) — скилл · mastra-ai · Claude Code, Codex, Cursor +3 · 2500 установок — Скилл автоматически генерирует Playwright E2E тесты при изменении компонентов playground. - [reference-signal-forms](https://affpapa.org/nevibecode/skills/reference-signal-forms.md) — скилл · angular · Claude Code, Codex, Cursor +3 · 969 установок — Разбирает архитектуру signal-based forms в Angular и помогает безопаснее работать с packages/forms/signals, где форма строится вокруг сигнала. - [ima-dai-sdk](https://affpapa.org/nevibecode/skills/ima-dai-sdk.md) — скилл (официальный Google) · Google LLC · Claude Code, Gemini CLI, Codex · 4300 установок — Скилл помогает подключить Google IMA DAI SDK для загрузки HLS- и DASH-потоков. - [visual-design-foundations](https://affpapa.org/nevibecode/skills/visual-design-foundations.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 13566 установок — Скилл помогает задать типографику, цвета и интервалы для проекта. - [baoyu-design](https://affpapa.org/nevibecode/skills/baoyu-design.md) — скилл · JimLiu · Claude Code, Codex, Cursor +3 · 6300 установок — Скилл генерирует макеты интерфейсов, интерактивные прототипы и презентации в виде автономного HTML. - [adev-writing-guide](https://affpapa.org/nevibecode/skills/adev-writing-guide.md) — скилл · angular · Claude Code, Codex, Cursor +3 · 912 установок — Скилл задаёт правила технического писательства Google и разметку для документации Angular в adev/. - [typescript-write](https://affpapa.org/nevibecode/skills/typescript-write.md) — скилл · metabase · Claude Code, Codex, Cursor +3 · 2100 установок — Скилл для написания и редактирования TypeScript и JavaScript кода с соблюдением стандартов Metabase. - [web-component-design](https://affpapa.org/nevibecode/skills/web-component-design.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 13167 установок — Скилл помогает проектировать компоненты для React, Vue и Svelte. - [threejs](https://affpapa.org/nevibecode/skills/threejs.md) — скилл · nexu-io · Claude Code, Codex, Cursor +3 · 3400 установок — Помогает ассистенту создавать 3D-сцены, настраивать материалы, камеру и пост-обработку на Three.js прямо в браузере. - [design-brief](https://affpapa.org/nevibecode/skills/nexu-io-design-brief.md) — скилл · nexu-io · Claude Code, Codex, Cursor +3 · 3400 установок — Преобразует дизайн-бриф в формате I-Lang в конкретную спецификацию с палитрой, типографикой, плотностью и ограничениями. - [seo-schema](https://affpapa.org/nevibecode/skills/seo-schema.md) — скилл · AgriciDaniel · Claude Code, Codex, Cursor +3 · 7000 установок — Скилл находит, проверяет и генерирует микроразметку Schema.org в формате JSON-LD. - [improve-ui](https://affpapa.org/nevibecode/skills/improve-ui.md) — скилл · ibelick · Claude Code, Codex, Cursor +3 · 7900 установок — Проверяет интерфейс на соответствие его дизайн-системе, находит доказанные расхождения и составляет планы исправлений для другого агента. - [expo-ui](https://affpapa.org/nevibecode/skills/expo-ui.md) — скилл · expo · Claude Code, Codex, Cursor +3 · 31800 установок — Скилл для создания интерфейсов, которые рендерятся в настоящий native код: SwiftUI на iOS и Jetpack Compose на Android. - [premium-frontend-ui](https://affpapa.org/nevibecode/skills/premium-frontend-ui.md) — скилл (официальный GitHub) · Utkarsh Patrikar · GitHub Copilot · 4900 установок — Направляет GitHub Copilot при создании визуально выразительных страниц и компонентов с анимацией. - [expo-native-ui](https://affpapa.org/nevibecode/skills/expo-native-ui.md) — скилл · expo · Claude Code, Codex, Cursor +3 · 31700 установок — Настраивает правила вёрстки нативных экранов в Expo по гайдам Apple HIG: цвета, элементы @expo/ui, SF Symbols и адаптивные отступы. - [react-modernization](https://affpapa.org/nevibecode/skills/react-modernization.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 12625 установок — Скилл обновляет React-код, переносит классовые компоненты на хуки и помогает внедрять возможности React 18. - [analytics-events](https://affpapa.org/nevibecode/skills/analytics-events.md) — скилл · metabase · Claude Code, Codex, Cursor +3 · 2000 установок — Скилл добавляет события продуктовой аналитики Snowplow во фронтенд Metabase. - [wcag-audit-patterns](https://affpapa.org/nevibecode/skills/wcag-audit-patterns.md) — скилл · Seth Hobson · Claude Code, Codex, Cursor · 12486 установок — Проверяет веб-интерфейс по WCAG 2.2, сочетая автотесты и ручную проверку. - [threejs-animation](https://affpapa.org/nevibecode/skills/threejs-animation.md) — скилл · CloudAI-X · Claude Code, Codex, Cursor +3 · 20400 установок — Скилл для работы с keyframe-анимацией, костями и морф-целями в Three.js. - [seo-images](https://affpapa.org/nevibecode/skills/seo-images.md) — скилл · AgriciDaniel · Claude Code, Codex, Cursor +3 · 6800 установок — Проверяет alt-текст, размер, формат (WebP/AVIF), адаптивность, ленивую загрузку и метаданные изображений на странице. - [cmux-custom-sidebar](https://affpapa.org/nevibecode/skills/cmux-custom-sidebar.md) — скилл · manaflow-ai · Claude Code, Codex, Cursor +3 · 4800 установок — Скилл для написания кастомной боковой панели cmux на SwiftUI-подобном языке. - [agentation-self-driving](https://affpapa.org/nevibecode/skills/agentation-self-driving.md) — скилл · benjitaylor · Claude Code, Codex, Cursor +3 · 7000 установок — Запускает автономный визуальный аудит интерфейса в открытом окне браузера и расставляет карточки замечаний через тулбар Agentation. - [cmux-localization](https://affpapa.org/nevibecode/skills/cmux-localization.md) — скилл · manaflow-ai · Claude Code, Codex, Cursor +3 · 4700 установок — Скилл для проверки и управления переводами пользовательских строк в интерфейсе. - [cmux-debugging](https://affpapa.org/nevibecode/skills/cmux-debugging.md) — скилл · manaflow-ai · Claude Code, Codex, Cursor +3 · 4800 установок — Скилл для добавления отладочных логов, диагностики проблем UI и рантайма в cmux. - [argent-react-native-optimization](https://affpapa.org/nevibecode/skills/argent-react-native-optimization.md) — скилл · software-mansion · Claude Code, Codex, Cursor +3 · 26500 установок — Скилл выявляет узкие места в React Native через замеры и очищает код от механических проблем. - [d3-visualization](https://affpapa.org/nevibecode/skills/d3-visualization.md) — скилл · nexu-io · Claude Code, Codex, Cursor +3 · 3100 установок — Скилл учит агента создавать интерактивные графики и визуализации данных на D3.js. - [design-review](https://affpapa.org/nevibecode/skills/nexu-io-design-review.md) — скилл · nexu-io · Claude Code, Codex, Cursor +3 · 3200 установок — Проводит визуальный аудит интерфейса, вносит точечные правки атомарными коммитами и сохраняет скриншоты до и после изменений. Дальше: https://affpapa.org/nevibecode/skills/topic/frontend.md?page=8 ## Уточнить [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=`, `&topic=<…>`, `&sort=installs|stars|new|updated` — значения в https://affpapa.org/nevibecode/agents.md --- NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md