# Скиллы по теме «Фронтенд и UI» Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов. 2909 карточек · страница 25 из 73 - HTML: https://affpapa.org/nevibecode/skills/topic/frontend?page=25 - Инструкция для агента: https://affpapa.org/nevibecode/agents.md - [build-daily-inspiration-sites](https://affpapa.org/nevibecode/skills/build-daily-inspiration-sites.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1200 установок — Создаёт отдельные задачи Codex для оригинальных лендингов по готовой подборке UI-референсов. - [build-threejs-enemy-systems](https://affpapa.org/nevibecode/skills/build-threejs-enemy-systems.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1200 установок — Скилл помогает проектировать архетипы и мувсеты врагов для Three.js. - [build-game-inventory](https://affpapa.org/nevibecode/skills/build-game-inventory.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1200 установок — Помогает собрать или исправить игровой инвентарь: предметы, экипировку, перетаскивание, сохранения и проверки без потери вещей. - [author-game-levels](https://affpapa.org/nevibecode/skills/author-game-levels.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1200 установок — Помогает проектировать и править уровни для игр на Three.js с абсолютно плоской геометрией геймплея. - [pixijs](https://affpapa.org/nevibecode/skills/pixijs.md) — скилл · pixijs · Claude Code, Codex, Cursor +3 · 6900 установок — Маршрутизирует задачи по PixiJS v8 к специализированным инструкциям рендеринга и сцены. - [swift-charts](https://affpapa.org/nevibecode/skills/swift-charts.md) — скилл · dpearson2699 · Claude Code, Codex, Cursor +3 · 4000 установок — Скилл для ИИ-агента, который помогает строить и разбирать графики на Swift Charts под iOS 26+. - [swiftui-gestures](https://affpapa.org/nevibecode/skills/swiftui-gestures.md) — скилл · dpearson2699 · Claude Code, Codex, Cursor +3 · 4000 установок — Помогает настраивать жесты в SwiftUI: объединяет нажатия, смахивания и зум, а также устраняет конфликты в иерархии представлений. - [swiftui-uikit-interop](https://affpapa.org/nevibecode/skills/swiftui-uikit-interop.md) — скилл · dpearson2699 · Claude Code, Codex, Cursor +3 · 4100 установок — Помогает связать интерфейсы UIKit и SwiftUI без путаницы с жизненным циклом и потерей данных в общих состояниях. - [email-template-builder](https://affpapa.org/nevibecode/skills/email-template-builder.md) — скилл · Alireza Rezvani · Claude Code · 602 установки — Создаёт систему транзакционных писем на React Email или MJML, подключает провайдеров и добавляет предпросмотр. - [platform-flexipage-generate](https://affpapa.org/nevibecode/skills/platform-flexipage-generate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 6000 установок — Создаёт и настраивает страницы Salesforce Lightning FlexiPage через шаблоны CLI. - [design-systems-slds-apply](https://affpapa.org/nevibecode/skills/design-systems-slds-apply.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 6000 установок — Скилл учит агента собирать интерфейсы на Salesforce Lightning Design System: подбирать блюпринты, хуки стилей, утилитарные классы и иконки. - [remotion-motion-graphics](https://affpapa.org/nevibecode/skills/remotion-motion-graphics.md) — скилл · haidrrrry · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл для ИИ-кодинга, который заставляет агента писать код Remotion по правилам моушн-дизайна, а не выдавать линейные фейды и плоские фоны. - [scroll-reveal-libraries](https://affpapa.org/nevibecode/skills/scroll-reveal-libraries.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2400 установок — Подключает лёгкие CSS-анимации появления элементов при прокрутке через библиотеку AOS. - [react-spring-physics](https://affpapa.org/nevibecode/skills/react-spring-physics.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2400 установок — Скилл для React-анимаций на физике пружин: React Spring и Popmotion. - [design-systems-slds-validate](https://affpapa.org/nevibecode/skills/design-systems-slds-validate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 5900 установок — Проверяет Lightning Web Components на соответствие SLDS: гоняет линтер, ищет проблемы в CSS и HTML, ставит оценку. - [compose-ui-testing-patterns](https://affpapa.org/nevibecode/skills/compose-ui-testing-patterns.md) — скилл · chrisbanes · Claude Code, Codex, Cursor +3 · 2200 установок — Помогает писать и проверять UI-тесты Jetpack Compose: семантику, снимки экрана, ввод с клавиатуры и состояния взаимодействия. - [performance-lighthouse-runner](https://affpapa.org/nevibecode/skills/performance-lighthouse-runner.md) — скилл · Jeremy Longshore · Claude Code, Codex, Cursor +3 · 632 установки — Скилл даёт пошаговые рекомендации и помогает создавать код и конфигурации для задач производительности во фронтенде. - [platform-custom-application-generate](https://affpapa.org/nevibecode/skills/platform-custom-application-generate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 5800 установок — Генерирует метаданные Lightning-приложений Salesforce с вкладками, брендингом и переопределением действий. - [critique-typography](https://affpapa.org/nevibecode/skills/critique-typography.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 установок — Проверяет типографику отрендеренного экрана: шкалу, читаемость, единообразие и использование токенов. - [critique-visual-hierarchy](https://affpapa.org/nevibecode/skills/critique-visual-hierarchy.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 установок — Скилл разбирает готовый экран по четырём измерениям и говорит, куда на самом деле падает взгляд. - [brand-guidelines](https://affpapa.org/nevibecode/skills/getsentry-brand-guidelines.md) — скилл · getsentry · Claude Code, Codex, Cursor +3 · 2500 установок — Задаёт правила редактуры интерфейса и текстов в стиле Sentry: от лаконичных кнопок до ироничных пустых экранов. - [nuxthub](https://affpapa.org/nevibecode/skills/nuxthub.md) — скилл · onmax · Claude Code, Codex, Cursor +3 · 2200 установок — Помогает настраивать NuxtHub v0.10.8 с базой данных на Drizzle ORM, KV-хранилищем и blob. - [pwa-development](https://affpapa.org/nevibecode/skills/pwa-development.md) — скилл · alinaqi · Claude Code, Codex, Cursor +3 · 4100 установок — Скилл для сборки Progressive Web App: манифест, service worker, стратегии кэширования и офлайн-режим. - [playcanvas-engine](https://affpapa.org/nevibecode/skills/playcanvas-engine.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2300 установок — Помогает настраивать трёхмерные сцены и веб-игры на движке PlayCanvas с архитектурой ECS. - [aframe-webxr](https://affpapa.org/nevibecode/skills/aframe-webxr.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2300 установок — Скилл для сборки браузерных 3D-, VR- и AR-сцен на A-Frame: агент пишет декларативную разметку вместо длинного JavaScript. - [barba-js](https://affpapa.org/nevibecode/skills/barba-js.md) — скилл · freshtechbro · Claude Code, Codex, Cursor +3 · 2400 установок — Скилл по Barba.js: помогает настроить плавные переходы между страницами без полной перезагрузки и связать их с GSAP. - [full-page-screenshot](https://affpapa.org/nevibecode/skills/full-page-screenshot.md) — скилл · Alireza Rezvani · Claude Code · 564 установки — Снимает целую веб-страницу в один PNG, включая контент за прокруткой. - [internal-dev-workbench](https://affpapa.org/nevibecode/skills/internal-dev-workbench.md) — скилл · Pranay Prakash · Claude Code, Codex, Cursor +3 · 645 установок — Скилл поднимает tmux-сессию для разработки Workflow SDK: сервер Next.js, интерфейс наблюдаемости и отдельные адреса для git worktree. - [design-systems-slds2-migrate](https://affpapa.org/nevibecode/skills/design-systems-slds2-migrate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 5600 установок — Прогоняет линтер SLDS по компонентам и помогает починить нарушения при переезде Lightning Web Components с SLDS 1 на SLDS 2. - [shadcn-ui](https://affpapa.org/nevibecode/skills/jezweb-shadcn-ui.md) — скилл · jezweb · Claude Code, Codex, Cursor +3 · 3600 установок — Ставит и настраивает компоненты shadcn/ui в React-проекте: подбирает их по задаче, следит за порядком установки и зависимостями. - [publish-project-to-github](https://affpapa.org/nevibecode/skills/publish-project-to-github.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1100 установок — Упаковывает локальный проект в репозиторий GitHub, создаёт README со скриншотом, запускает аудит секретов и настраивает GitHub Pages. - [build-interactive-particle-trail](https://affpapa.org/nevibecode/skills/build-interactive-particle-trail.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл для интерактивных частиц: курсор или палец оставляет след из точек, которые летят по своей траектории. - [web-technique-to-skill](https://affpapa.org/nevibecode/skills/web-technique-to-skill.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1100 установок — Помогает превратить готовый визуальный или интерактивный приём в переиспользуемый скилл для веб-дизайна — с демо, которое доказывает и механику, и точность. - [add-mouse-driven-orbit](https://affpapa.org/nevibecode/skills/add-mouse-driven-orbit.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 1200 установок — Добавляет плавный параллакс и кинематографичное вращение сцены Three.js вслед за курсором мыши без OrbitControls. - [design-audit](https://affpapa.org/nevibecode/skills/bencium-design-audit.md) — скилл · bencium · Claude Code, Codex, Cursor +3 · 4100 установок — Проверяет визуальный дизайн приложения и готовит поэтапный план правок. - [good-css](https://affpapa.org/nevibecode/skills/good-css.md) — скилл · vojtaholik · Claude Code, Codex, Cursor +3 · 1500 установок — Заменяет каскады брейкпоинтов и вспомогательные скрипты современными возможностями CSS. - [form-design](https://affpapa.org/nevibecode/skills/form-design.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 1900 установок — Проектирует веб-формы от порядка полей и группировки до валидации и доступности. - [aesthetic-usability](https://affpapa.org/nevibecode/skills/aesthetic-usability.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 1900 установок — Помогает оценить, как визуальная цельность интерфейса влияет на ощущение удобства и доверия. - [critique-composition](https://affpapa.org/nevibecode/skills/critique-composition.md) — скилл · Owl-Listener · Claude Code, Codex, Cursor +3 · 1900 установок — Оценивает баланс, пустое пространство, ритм и гештальт-группировку на готовом экране. - [tipkit](https://affpapa.org/nevibecode/skills/tipkit.md) — скилл · dpearson2699 · Claude Code, Codex, Cursor +3 · 3600 установок — Скилл помогает добавлять и проверять подсказки Apple TipKit: встроенные в экран или привязанные к элементу управления. Дальше: https://affpapa.org/nevibecode/skills/topic/frontend.md?page=26 ## Уточнить [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