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

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

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

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

- [vercel-deployment](https://affpapa.org/nevibecode/skills/vercel-deployment.md) — скилл · davila7 · Claude Code · 124 установки — Скилл для Claude, который подсказывает, как правильно выкатывать Next.js на Vercel: переменные окружения, edge и serverless, кэш сборки.
- [ui-ux-governance](https://affpapa.org/nevibecode/skills/ui-ux-governance.md) — скилл · GanyuanRan · Claude Code, Codex, Cursor +3 · ★ 1388 — Скилл задаёт агенту рамки при работе с интерфейсами: как выбирать решения по потокам, состояниям и доступности.
- [screenshot-feature-extractor](https://affpapa.org/nevibecode/skills/screenshot-feature-extractor.md) — скилл · davila7 · Claude Code · 97 установок — Разбирает скриншоты интерфейсов и превращает найденные функции и взаимодействия в список задач.
- [makepad-2.0-widgets](https://affpapa.org/nevibecode/skills/makepad-20-widgets.md) — скилл · ZhangHanDong · Claude Code, Codex, Cursor +3 · ★ 751 — Подсказывает агенту, какие виджеты есть в Makepad 2.0 и как их правильно писать в Splash.
- [makepad-2.0-troubleshooting](https://affpapa.org/nevibecode/skills/makepad-20-troubleshooting.md) — скилл · ZhangHanDong · Claude Code, Codex, Cursor +3 · ★ 751 — Скилл для разбора типичных ошибок Makepad 2.0 и языка Splash: невидимый интерфейс, пропавший текст, сломанный горячий перезапуск.
- [makepad-2.0-theme](https://affpapa.org/nevibecode/skills/makepad-20-theme.md) — скилл · ZhangHanDong · Claude Code, Codex, Cursor +3 · ★ 751 — Скилл для работы с темой Makepad 2.0: переменные theme.*, переключение тёмного и светлого режимов, цвета, шрифты и отступы в Splash.
- [makepad-2.0-performance](https://affpapa.org/nevibecode/skills/makepad-20-performance.md) — скилл · ZhangHanDong · Claude Code, Codex, Cursor +3 · ★ 751 — Скилл для оптимизации и отладки Makepad 2.0: разбирает батчинг отрисовки, сборку мусора Splash VM и кэширование текстур.
- [makepad-2.0-events](https://affpapa.org/nevibecode/skills/makepad-20-events.md) — скилл · ZhangHanDong · Claude Code, Codex, Cursor +3 · ★ 751 — Скилл makepad-2.0-events помогает агенту разбираться с событиями и действиями в Makepad 2.0: от on_click в Splash до трейта MatchEvent в Rust.
- [makepad-2.0-app-structure](https://affpapa.org/nevibecode/skills/makepad-20-app-structure.md) — скилл · ZhangHanDong · Claude Code, Codex, Cursor +3 · ★ 751 — Помогает собрать каркас приложения на Makepad 2.0: Rust-часть, Splash-разметка, обработка событий и запуск с горячей перезагрузкой.
- [javascript-pro](https://affpapa.org/nevibecode/skills/javascript-pro.md) — скилл · davila7 · Claude Code · 79 установок — Скилл для Claude, который ведёт агента по современному JavaScript: ES6+, промисы, event loop, API Node.js и браузера.
- [core-components](https://affpapa.org/nevibecode/skills/core-components.md) — скилл · davila7 · Claude Code · 66 установок — Скилл для Claude, который заставляет агента собирать интерфейс из компонентов вашей библиотеки и дизайн-токенов вместо сырых значений.
- [cc-skill-coding-standards](https://affpapa.org/nevibecode/skills/cc-skill-coding-standards.md) — скилл · affaan-m · Claude Code · 66 установок — Скилл задаёт агенту единые стандарты для TypeScript, JavaScript, React и Node.js: имена, иммутабельность, обработку ошибок, структуру API.
- [sveltekit](https://affpapa.org/nevibecode/skills/sveltekit.md) — скилл · suhaibjanjua · Claude Code · 50 установок — Скилл для Claude, который помогает собирать приложения на SvelteKit: маршруты по файлам, серверный рендеринг, эндпоинты и обработка форм.
- [nerv-ui](https://affpapa.org/nevibecode/skills/nerv-ui.md) — скилл · mdrbx · Claude Code, Codex, Cursor +3 · ★ 95 — Скилл помогает агенту собирать React-интерфейсы командного центра на опубликованной библиотеке @mdrbx/nerv-ui — дашборды, мониторинговые терминалы, экраны входа.
- [design-auditor](https://affpapa.org/nevibecode/skills/design-auditor.md) — скилл · Ashutos1997 · Claude Code, Codex, Cursor +3 · ★ 89 — Проверяет вёрстку и макеты по 19 правилам: контраст, фокус, aria, тёмные паттерны.
- [reimagine-it-lock](https://affpapa.org/nevibecode/skills/reimagine-it-lock.md) — скилл · Kayforkind · Claude Code, Codex, Cursor +3 · ★ 212 — Скилл снимает палитру, шрифты, мотивы и анимацию с готового HTML-файла и сохраняет их как переносимый набор для повторного использования.
- [custom-blocks](https://affpapa.org/nevibecode/skills/makenotion-custom-blocks.md) — скилл · makenotion · Claude Code, Codex, Cursor +3 · ★ 220 — Помогает собрать интерактивный интерфейс внутри Notion, который читает и меняет данные рабочего пространства.
- [custom-blocks](https://affpapa.org/nevibecode/skills/custom-blocks.md) — скилл · makenotion · Claude Code, Codex, Cursor +3 · ★ 220 — Скилл для работы с интерактивными кастомными блоками, которые объявляет Notion App.
- [slidewright](https://affpapa.org/nevibecode/skills/slidewright.md) — скилл · tronghieu · Claude Code, Codex, Cursor +3 · ★ 88 — Собирает слайды как сайт для показа на большом экране: один ведущий, аудитория только смотрит.
- [design-intelligence](https://affpapa.org/nevibecode/skills/design-intelligence.md) — скилл · c0x12c · Claude Code, Codex, Cursor +3 · ★ 109 — Собирает дизайн-систему с нуля: палитра, типографика, отступы, радиусы и инвентарь компонентов в трёх форматах.
- [ui-ux-design-principles](https://affpapa.org/nevibecode/skills/ui-ux-design-principles.md) — скилл · databricks-solutions · Claude Code, Codex, Cursor +3 · ★ 36 — Канон решений о пользовательском опыте: чек-лист ревью, жёсткие правила и ссылки на детали.
- [suede-site-alchemy](https://affpapa.org/nevibecode/skills/suede-site-alchemy.md) — скилл · JasonColapietro · Claude Code, Codex, Cursor +3 · ★ 126 — Скилл для оптимизации конверсии лендингов, промо- и продуктовых страниц: находит трение, чинит воронку и проверяет правки.
- [suede-design](https://affpapa.org/nevibecode/skills/suede-design.md) — скилл · JasonColapietro · Claude Code, Codex, Cursor +3 · ★ 126 — Скилл для ИИ-кодинга, который делает интерфейсы осмысленными, а не шаблонными: токены, цвет, типографика, тёмная тема, вёрстка и визуальный QA.
- [developer-sandbox](https://affpapa.org/nevibecode/skills/developer-sandbox.md) — скилл · jonathimer · Claude Code, Codex, Cursor +3 · ★ 87 — Помогает спроектировать интерактивную песочницу, где разработчик пробует продукт без регистрации.
- [multitenant](https://affpapa.org/nevibecode/skills/multitenant.md) — скилл · finom · Claude Code, Codex, Cursor +3 · ★ 57 — Скилл для Vovk.ts: разводит несколько тенантов по поддоменам в одном Next.js-приложении — прокси, сегменты, страницы.
- [tile-picking-interaction](https://affpapa.org/nevibecode/skills/tile-picking-interaction.md) — скилл · 0xheycat · Claude Code, Codex, Cursor +3 · ★ 41 — Превращает позицию курсора или касания в точный тайл изометрической карты — с учётом панорамирования и зума камеры.
- [canvas2d-isometric-renderer](https://affpapa.org/nevibecode/skills/canvas2d-isometric-renderer.md) — скилл · 0xheycat · Claude Code, Codex, Cursor +3 · ★ 41 — Собирает цикл отрисовки изометрической карты на Canvas 2D: тайлы фоном, объекты после них и по глубине.
- [ux](https://affpapa.org/nevibecode/skills/rainmanjam-ux.md) — скилл · rainmanjam · Claude Code, Codex, Cursor +3 · ★ 24 — Помогает агенту разложить экран на компоненты, определить владельца состояния и не смешивать вёрстку с бизнес-правилами.
- [ux](https://affpapa.org/nevibecode/skills/ux.md) — скилл · rainmanjam · Claude Code, Codex, Cursor +3 · ★ 24 — Скилл для проектирования интерфейсов, где пользователь не может сделать необратимую ошибку: формы, удаление, массовые действия, оплата.

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