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

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

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

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

- [page-transitions](https://affpapa.org/nevibecode/skills/page-transitions.md) — скилл · dylantarre · Claude Code, Codex, Cursor +3 · 669 установок — Скилл для анимации смены маршрутов, модалок и навигации.
- [rspress-docs-generator](https://affpapa.org/nevibecode/skills/rspress-docs-generator.md) — скилл · rstackjs · Claude Code, Codex, Cursor +3 · 306 установок — Разворачивает сайт документации на Rspress v2 или обновляет существующие страницы под изменения в коде, тестах и API.
- [echarts](https://affpapa.org/nevibecode/skills/echarts.md) — скилл · sentimony · Claude Code, Codex, Cursor +3 · 2700 установок — Скилл для работы с графиками Apache ECharts: сборка, стилизация, отладка и оптимизация в JavaScript, React и Vue.
- [accessibility-and-inclusive-visualization](https://affpapa.org/nevibecode/skills/accessibility-and-inclusive-visualization.md) — скилл (официальный OpenAI) · OpenAI · Codex, ChatGPT · 11 установок — Скилл для Codex и ChatGPT, который проверяет графики, диаграммы и дашборды на доступность: контраст, подписи, клавиатура, текстовая альтернатива.
- [react-hook-form-zod](https://affpapa.org/nevibecode/skills/secondsky-react-hook-form-zod.md) — скилл · secondsky · Claude Code, Codex, Cursor +3 · 376 установок — Помогает создавать формы на React с валидацией через Zod и React Hook Form.
- [react-native-animations](https://affpapa.org/nevibecode/skills/react-native-animations.md) — скилл · pluginagentmarketplace · Claude Code, Codex, Cursor +3 · 663 установки — Свод инструкций по плавной анимации интерфейсов в React Native на базе Reanimated 3 и Gesture Handler.
- [fitness-wellness](https://affpapa.org/nevibecode/skills/fitness-wellness.md) — скилл · dylantarre · Claude Code, Codex, Cursor +3 · 663 установки — Скилл задаёт тайминги и приёмы анимации для фитнес-приложений, трекеров тренировок и медитаций.
- [jest-generator](https://affpapa.org/nevibecode/skills/jest-generator.md) — скилл · secondsky · Claude Code, Codex, Cursor +3 · 374 установки — Генерирует модульные тесты на Jest для JavaScript, TypeScript и React-компонентов.
- [inngest-realtime](https://affpapa.org/nevibecode/skills/inngest-realtime.md) — скилл · inngest · Claude Code, Codex, Cursor +3 · 797 установок — Скилл учит агента публиковать обновления из durable-функций Inngest в живой интерфейс: статусы заказов, стриминг токенов, логи и подтверждения от пользователя.
- [thesys-generative-ui](https://affpapa.org/nevibecode/skills/thesys-generative-ui.md) — скилл · secondsky · Claude Code, Codex, Cursor +3 · 371 установка — Скилл учит агента собирать React-компоненты из описания на естественном языке через Thesys SDK.
- [nuxt-studio](https://affpapa.org/nevibecode/skills/secondsky-nuxt-studio.md) — скилл · secondsky · Claude Code, Codex, Cursor +3 · 368 установок — Настраивает визуальный редактор Nuxt Studio для проектов на Nuxt Content.
- [maz-ui](https://affpapa.org/nevibecode/skills/maz-ui.md) — скилл · secondsky · Claude Code, Codex, Cursor +3 · 369 установок — Скилл даёт агенту знание Maz-UI v4: 50+ компонентов, composables, директивы и темы для Vue 3 и Nuxt 3.
- [sales-app-extensibility](https://affpapa.org/nevibecode/skills/sales-app-extensibility.md) — скилл · vtex · Claude Code, Codex, Cursor +3 · 856 установок — Помогает разрабатывать, настраивать и собирать расширения для VTEX Sales App.
- [e-commerce-retail](https://affpapa.org/nevibecode/skills/e-commerce-retail.md) — скилл · dylantarre · Claude Code, Codex, Cursor +3 · 647 установок — Скилл описывает анимации для карточек товаров, корзины и оформления заказа по 12 принципам Disney.
- [mastering-animate-presence](https://affpapa.org/nevibecode/skills/mastering-animate-presence.md) — скилл · raphael-salaja · Claude Code, Codex, Cursor +3 · 323 установки — Проверяет код Motion и Framer Motion на ошибки в AnimatePresence и exit-анимациях.
- [tigris-static-assets](https://affpapa.org/nevibecode/skills/tigris-static-assets.md) — скилл · tigrisdata · Claude Code, Codex, Cursor +3 · 3100 установок — Настраивает выгрузку статики в хранилище Tigris с глобальной раздачей через CDN, заголовками Cache-Control и интеграцией с веб-фреймворками.
- [tigris-image-optimization](https://affpapa.org/nevibecode/skills/tigris-image-optimization.md) — скилл · tigrisdata · Claude Code, Codex, Cursor +3 · 3100 установок — Скилл для работы с картинками в Tigris: режет варианты при загрузке, отдаёт их через публичный бакет и подсказывает настройки под ваш фреймворк.
- [accessible-motion](https://affpapa.org/nevibecode/skills/accessible-motion.md) — скилл · dylantarre · Claude Code, Codex, Cursor +3 · 642 установки — Скилл помогает заменить опасные анимации на безопасные альтернативы и соблюсти требования WCAG по движению.
- [gh-pages-deploy](https://affpapa.org/nevibecode/skills/gh-pages-deploy.md) — скилл · aviz85 · Claude Code, Codex, Cursor +3 · 312 установок — Скилл публикует HTML/CSS/JS-проекты в GitHub Pages через gh.
- [pwa-development](https://affpapa.org/nevibecode/skills/jwynia-pwa-development.md) — скилл · jwynia · Claude Code, Codex, Cursor +3 · 437 установок — Скилл для React и Svelte: помогает добавить service worker, офлайн-режим и установку приложения.
- [react-flow-code-review](https://affpapa.org/nevibecode/skills/react-flow-code-review.md) — скилл · existential-birds · Claude Code, Codex, Cursor +3 · 319 установок — Проверяет код на @xyflow/react по чек-листу: антипаттерны, лишние ре-рендеры, типы.
- [anime-js](https://affpapa.org/nevibecode/skills/dylantarre-anime-js.md) — скилл · dylantarre · Claude Code, Codex, Cursor +3 · 639 установок — Скилл для ИИ-агента, который подсказывает, как собрать анимацию на Anime.js по 12 принципам Disney.
- [woocommerce-copy-guidelines](https://affpapa.org/nevibecode/skills/woocommerce-copy-guidelines.md) — скилл · secondsky · Claude Code, Codex, Cursor +3 · 363 установки — Скилл задаёт правила написания пользовательских текстов в WooCommerce: подписи кнопок, метки полей, сообщения и документация.
- [render-static-sites](https://affpapa.org/nevibecode/skills/render-static-sites.md) — скилл · Render · Claude Code, Codex, Cursor +3 · 367 установок — Помогает агенту развернуть статический сайт или SPA на CDN Render: команды сборки, путь публикации, роутинг, заголовки и превью из пул-реквестов.
- [sentry-react-sdk](https://affpapa.org/nevibecode/skills/getsentry-sentry-react-sdk.md) — скилл · getsentry · Claude Code, Codex, Cursor +3 · 579 установок — Скилл сканирует React-приложение и проводит через полную настройку Sentry: ошибки, трейсинг, session replay, логи и профилирование.
- [capacitor-vue](https://affpapa.org/nevibecode/skills/capacitor-vue.md) — скилл · capawesome-team · Claude Code, Codex, Cursor +3 · 757 установок — Помогает внедрять нативные плагины Capacitor в проекты на Vue 3, Quasar и Nuxt с помощью Composition API и реактивных композаблов.
- [remotion-animation](https://affpapa.org/nevibecode/skills/remotion-animation.md) — скилл · ncklrs · Claude Code, Codex, Cursor +3 · 441 установка — Формирует параметры анимаций для Remotion: пружины, интерполяции и тайминги кадров без кода компонентов.
- [brand-color-psychology](https://affpapa.org/nevibecode/skills/brand-color-psychology.md) — скилл · mike-coulbourn · Claude Code, Codex, Cursor +3 · 300 установок — Справочник по подбору палитры с учётом психологии восприятия, контрастности и архетипов.
- [webgl](https://affpapa.org/nevibecode/skills/webgl.md) — скилл · martinholovsky · Claude Code, Codex, Cursor +3 · 555 установок — Скилл по WebGL для кастомных шейдеров и визуальных эффектов: голограммы, постобработка, системы частиц.
- [cloudinary-transformations](https://affpapa.org/nevibecode/skills/cloudinary-transformations.md) — скилл · cloudinary · Claude Code, Codex, Cursor +3 · 852 установки — Скилл собирает и отлаживает URL трансформаций Cloudinary из обычной просьбы на русском или английском.
- [mapbox-navigation-patterns](https://affpapa.org/nevibecode/skills/mapbox-navigation-patterns.md) — скилл · mapbox · Claude Code, Codex, Cursor +3 · 401 установка — Подсказывает агенту, как собрать пошаговую навигацию, мультистоповые маршруты и голосовые подсказки на Mapbox.
- [tauri](https://affpapa.org/nevibecode/skills/tauri.md) — скилл · martinholovsky · Claude Code, Codex, Cursor +3 · 550 установок — Скилл настраивает десктопные приложения на Tauri 2.0 с упором на безопасность IPC, изоляцию путей и разграничение прав через capabilities.
- [gsap-awwwards-website](https://affpapa.org/nevibecode/skills/gsap-awwwards-website.md) — скилл · rebyteai-template · Claude Code, Codex, Cursor +3 · 810 установок — Скилл разворачивает шаблон продуктового лендинга на React 19 с GSAP-анимациями по скроллу и Tailwind CSS 4.
- [suggest-lucide-icons](https://affpapa.org/nevibecode/skills/suggest-lucide-icons.md) — скилл · nweii · Claude Code, Codex, Cursor +3 · 616 установок — Подбирает иконки из набора Lucide под понятие, место в интерфейсе или заметку.
- [jkvideo-bilibili-react-native](https://affpapa.org/nevibecode/skills/jkvideo-bilibili-react-native.md) — скилл · reason-machines · Claude Code, Codex, Cursor +3 · 879 установок — Скилл помогает разрабатывать мобильный клиент Bilibili на базе React Native 0.83 и Expo SDK 55.
- [svg-art](https://affpapa.org/nevibecode/skills/svg-art.md) — скилл · kv0906 · Claude Code, Codex, Cursor +3 · 510 установок — Скилл для генерации SVG-графики кодом: иконки, паттерны, фракталы, диаграммы и графики через исполняемые Python-скрипты.
- [audit](https://affpapa.org/nevibecode/skills/audit.md) — скилл (официальный OpenAI) · OpenAI · Codex, ChatGPT · 10 установок — Пошагово проходит интерфейсы, сохраняет проверенные скриншоты и формирует отчёт по UX и доступности прямо в чате.
- [stream-react-native](https://affpapa.org/nevibecode/skills/stream-react-native.md) — скилл · GetStream · Claude Code, Codex, Cursor +3 · 706 установок — Скилл для работы с Stream Chat, Video и Feeds в приложениях React Native CLI и Expo: сборка, интеграция, миграции и аудит.
- [healthcare-medical](https://affpapa.org/nevibecode/skills/healthcare-medical.md) — скилл · dylantarre · Claude Code, Codex, Cursor +3 · 606 установок — Задаёт правила анимации для медицинских приложений, порталов пациентов и телемедицины: спокойные переходы вместо резких.
- [critique](https://affpapa.org/nevibecode/skills/aladicf-critique.md) — скилл · aladicf · Claude Code, Codex, Cursor +3 · 705 установок — Разбирает интерфейс с точки зрения UX, проверяет визуальную иерархию и когнитивную нагрузку.

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

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