# Скиллы по теме «Фронтенд и UI» Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов. 2909 карточек · страница 36 из 73 - HTML: https://affpapa.org/nevibecode/skills/topic/frontend?page=36 - Инструкция для агента: https://affpapa.org/nevibecode/agents.md - [dt-obs-frontends](https://affpapa.org/nevibecode/skills/dt-obs-frontends.md) — скилл · Dynatrace · Claude Code, Codex, Cursor +3 · 2500 установок — Скилл для работы с Real User Monitoring в Dynatrace: Core Web Vitals, сессии, ошибки фронтенда и связь с бэкендом через DQL. - [shadertoy](https://affpapa.org/nevibecode/skills/shadertoy.md) — скилл · bfollington · Claude Code, Codex, Cursor +3 · 1500 установок — Скилл помогает писать фрагментные шейдеры GLSL ES для Shadertoy и WebGL. - [frontend-design](https://affpapa.org/nevibecode/skills/cline-frontend-design.md) — скилл · cline · Claude Code, Codex, Cursor +3 · 7300 установок — Скилл задаёт агенту смелое визуальное направление и заставляет доводить код до продакшн-уровня. - [tokens](https://affpapa.org/nevibecode/skills/tokens.md) — скилл · educlopez · Claude Code, Codex, Cursor +3 · 855 установок — Проверяет, как в проекте устроены дизайн-токены, и помогает собрать трёхслойную систему с нуля. - [superwall-editor](https://affpapa.org/nevibecode/skills/superwall-editor.md) — скилл · superwall · Claude Code, Codex, Cursor +3 · 3600 установок — Скилл для сборки и правки пейволов, онбординга и web2app-сценариев Superwall прямо из терминала. - [finalize](https://affpapa.org/nevibecode/skills/finalize.md) — скилл · educlopez · Claude Code, Codex, Cursor +3 · 852 установки — Прогоняет интерфейс через детектор, токены и 10 проходов планки качества, а потом выдаёт вердикт: READY, NOT READY или BLOCKED. - [brief](https://affpapa.org/nevibecode/skills/educlopez-brief.md) — скилл · educlopez · Claude Code, Codex, Cursor +3 · 851 установка — Создаёт или обновляет дизайн-бриф проекта в файле .ui-craft/brief.md. - [ux-extract](https://affpapa.org/nevibecode/skills/ux-extract.md) — скилл · jezweb · Claude Code, Codex, Cursor +3 · 664 установки — Обходит эталонное веб-приложение экран за экраном, снимает состояния и собирает библиотеку UX-паттернов, с которой потом сравнивают свою сборку. - [game-ui-frontend](https://affpapa.org/nevibecode/skills/game-ui-frontend.md) — скилл (официальный OpenAI) · OpenAI · Codex, ChatGPT · 98 установок — Скилл помогает проектировать интерфейсы браузерных игр: HUD, меню и оверлеи. - [assistant-ui](https://affpapa.org/nevibecode/skills/assistant-ui.md) — скилл · assistant-ui · Claude Code, Codex, Cursor +3 · 7200 установок — Помогает проектировать чат-интерфейсы на React: подсказывает архитектуру, выбор пакетов, рантаймов и хуков библиотеки assistant-ui. - [cargo-hosting](https://affpapa.org/nevibecode/skills/cargo-hosting.md) — скилл · getcargo · Claude Code, Codex, Cursor +3 · 9800 установок — Скилл учит агента создавать, собирать и выкатывать статические веб-приложения и edge-воркеры через Cargo CLI. - [angular-architecture](https://affpapa.org/nevibecode/skills/angular-architecture.md) — скилл · gentleman-programming · Claude Code, Codex, Cursor +3 · 320 установок — Скилл задаёт правила, куда класть компоненты Angular, как называть файлы и что менять в официальном стайлгайде. - [landing-page-conversion-audit](https://affpapa.org/nevibecode/skills/landing-page-conversion-audit.md) — скилл (официальный GitHub) · github · GitHub Copilot · 28 установок — Скилл находит утечки конверсии на посадочных страницах и экранах оплаты. - [no-use-effect](https://affpapa.org/nevibecode/skills/no-use-effect.md) — скилл · Factory-AI · Claude Code, Codex, Cursor +3 · 1000 установок — Скилл, который не даёт агенту писать useEffect в React-коде и подсказывает пять замен. - [react-2026](https://affpapa.org/nevibecode/skills/react-2026.md) — скилл · patterns.dev · Claude Code, Codex, Cursor +3 · 1900 установок — Подбирает архитектурный стек для новых и обновляемых проектов на React. - [ai-ui-patterns](https://affpapa.org/nevibecode/skills/ai-ui-patterns.md) — скилл · patterns.dev · Claude Code, Codex, Cursor +3 · 2000 установок — Скилл подсказывает агенту, как собирать чат-интерфейсы на React: стриминг ответов, состояние диалога, обработка ошибок. - [ux-compare](https://affpapa.org/nevibecode/skills/ux-compare.md) — скилл · jezweb · Claude Code, Codex, Cursor +3 · 647 установок — Читает библиотеки паттернов от ux-extract и собирает документ со сравнением: где приложения совпадают, где расходятся и что делать в новом билде. - [r3f-loaders](https://affpapa.org/nevibecode/skills/r3f-loaders.md) — скилл · EnzeD · Claude Code, Codex, Cursor +3 · 1800 установок — Помогает загружать и переиспользовать 3D-модели в React Three Fiber. - [r3f-physics](https://affpapa.org/nevibecode/skills/r3f-physics.md) — скилл · EnzeD · Claude Code, Codex, Cursor +3 · 1800 установок — Помогает добавить в React Three Fiber физику Rapier: тела, коллайдеры, силы, сенсоры и соединения. - [tanstack-table](https://affpapa.org/nevibecode/skills/tanstack-table.md) — скилл · tanstack-skills · Claude Code, Codex, Cursor +3 · 5400 установок — Скилл учит агента настраивать headless-таблицы на TanStack Table v8. - [webmcpify](https://affpapa.org/nevibecode/skills/webmcpify.md) — скилл (официальный GitHub) · github · GitHub Copilot · 27 установок — Скилл подключает действия веб-приложения как инструменты WebMCP, а затем проверяет их в браузере. - [checklist-design](https://affpapa.org/nevibecode/skills/checklist-design.md) — скилл · Checklist Design · Claude Code, Codex, Cursor +3 · 1100 установок — Проверяет интерфейсы сайтов и мобильных приложений по сотне чек-листов Checklist Design. - [flutter-adaptive-ui](https://affpapa.org/nevibecode/skills/flutter-adaptive-ui.md) — скилл · Stanislav \[MADTeacher\] Chernyshev · Claude Code, Codex, Cursor +3 · 2000 установок — Скилл направляет агента при разработке адаптивного UI во Flutter для мобильных экранов, десктопа и веба. - [frontend-design](https://affpapa.org/nevibecode/skills/ilm-alan-frontend-design.md) — скилл · Ilm-Alan · Claude Code, Codex, Cursor +3 · 580 установок — Скилл задаёт визуальное направление вёрстки: палитра, шрифты, структура и текстура держатся одного стиля от начала до конца. - [maplibre-tile-sources](https://affpapa.org/nevibecode/skills/maplibre-tile-sources.md) — скилл · maplibre · Claude Code, Codex, Cursor +3 · 982 установки — Помогает решить, что подойдёт набору данных в MapLibre GL JS: GeoJSON прямо из файла или векторные и растровые тайлы. - [nuqs](https://affpapa.org/nevibecode/skills/nuqs.md) — скилл · pproenca · Claude Code, Codex, Cursor +3 · 2300 установок — Скилл с 39 правилами по nuqs: типизированные парсеры, адаптеры, интеграция с Server Components и оптимизация обновлений URL. - [integration-privy](https://affpapa.org/nevibecode/skills/integration-privy.md) — скилл · solana-mobile · Claude Code, Codex, Cursor +3 · 11600 установок — Скилл для подключения Privy-аутентификации к Solana Expo Android-приложению поверх Mobile Wallet Adapter через Sign-In-With-Solana. - [solana-mobile-wallet](https://affpapa.org/nevibecode/skills/solana-mobile-wallet.md) — скилл · solana-mobile · Claude Code, Codex, Cursor +3 · 11600 установок — Скилл помогает подключить Solana-кошелёк в React Native Expo и работать с подписями и транзакциями. - [nextjs-cache-architecture](https://affpapa.org/nevibecode/skills/nextjs-cache-architecture.md) — скилл · mohamed-hossam1 · Claude Code, Codex, Cursor +3 · 5000 установок — Выстраивает архитектуру кеширования для Next.js 16+ App Router. - [mies](https://affpapa.org/nevibecode/skills/mies.md) — скилл · deeflect · Claude Code, Codex, Cursor +3 · 9600 установок — Скилл для ИИ-кодинга, который заставляет агента убирать лишнее в интерфейсах и доводить детали до аккуратности. - [r3f-best-practices](https://affpapa.org/nevibecode/skills/r3f-best-practices.md) — скилл · three-agent-skills · Claude Code, Codex, Cursor +3 · 1500 установок — Набор из 70+ правил для написания, ревью и ускорения кода на React Three Fiber. - [apple-hig-designer](https://affpapa.org/nevibecode/skills/apple-hig-designer.md) — скилл · jamesrochabrun · Claude Code, Codex, Cursor +3 · 1000 установок — Скилл помогает создавать интерфейсы iOS для iPhone, iPad и Apple Watch по стандартам Apple HIG. - [email-html-mjml](https://affpapa.org/nevibecode/skills/email-html-mjml.md) — скилл · Framix · Claude Code, Codex, Cursor +3 · 947 установок — Скилл собирает адаптивные шаблоны писем на MJML 5.x и компилирует их в HTML, который переживает Outlook и Gmail. - [design-better](https://affpapa.org/nevibecode/skills/design-better.md) — скилл · BuilderOS · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл для ИИ-агентов, который добавляет к генерации и ревью интерфейса правила UX/UI: иерархия, состояния, доступность, анимация. - [qt-qml-test](https://affpapa.org/nevibecode/skills/qt-qml-test.md) — скилл · qt-ai-skills · Claude Code, Codex, Cursor +3 · 597 установок — Создаёт файлы юнит-тестов Qt Quick Test для компонентов QML. - [design-system](https://affpapa.org/nevibecode/skills/rampstackco-design-system.md) — скилл · rampstackco · Claude Code, Codex, Cursor +3 · 311 установок — Собирает или проверяет дизайн-систему: токены, библиотеку компонентов, правила именования, модель контрибуции и документацию. - [scrape-webpage](https://affpapa.org/nevibecode/skills/scrape-webpage.md) — скилл · adobe · Claude Code, Codex, Cursor +3 · 1800 установок — Скилл скачивает страницу, извлекает метаданные и изображения, а затем сохраняет HTML и результаты анализа локально. - [extension-camera](https://affpapa.org/nevibecode/skills/extension-camera.md) — скилл · caffeinelabs · Claude Code, Codex, Cursor +3 · 28100 установок — Добавляет в агент правила работы с веб-камерой через React-хук useCamera. - [extension-qr-code](https://affpapa.org/nevibecode/skills/extension-qr-code.md) — скилл · caffeinelabs · Claude Code, Codex, Cursor +3 · 28200 установок — Добавляет в React-приложение сканирование QR-кодов через камеру устройства. - [react-vite-best-practices](https://affpapa.org/nevibecode/skills/react-vite-best-practices.md) — скилл · agent-skills · Claude Code, Codex, Cursor +3 · 2900 установок — Скилл с 23 правилами оптимизации React-приложений на Vite: сборка, code splitting, HMR, ассеты, переменные окружения и анализ бандла. Дальше: https://affpapa.org/nevibecode/skills/topic/frontend.md?page=37 ## Уточнить [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