NeVibeCode · 2 909 карточек
Скиллы по теме «Фронтенд и UI»
Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов.
web-design-guidelines скилл Скилл проверяет файлы интерфейса по актуальным правилам Web Interface Guidelines и выдаёт замечания с указанием файла и строки. Пригодится для аудита UI и доступности.
2 076установок
sanity-best-practices скилл Набор правил разработки на Sanity для ИИ-агента: схемы, GROQ, TypeGen, визуальный редактор, миграции и подключение к фронтенд-фреймворкам. Нужен, когда агент правит код проекта на Sanity.
CX Codex +1
31 800установок
typeui-fundamentals скилл Скилл задаёт агенту базовые правила UI/UX: визуальную иерархию, 4-пиксельную сетку, типографику и требования доступности WCAG. Выручает, когда в дизайн-системе нет готового ответа.
CX Codex +1
2 200установок
react-dev скилл Скилл помогает писать строго типизированный код на React 18–19 и переходить на новые API вроде useActionState.
CX Codex +1
4 100установок
react-native-brownfield-migration скилл Помогает пошагово внедрять React Native или Expo в нативные приложения iOS и Android с помощью @callstack/react-native-brownfield.
CX Codex +1
5 200установок
yaml скилл Потоковый парсер YAML для json-render, который превращает код-фенсы в JSON Patch. Подходит для прогрессивного рендеринга и точечных правок спеки через стрим.
CX Codex +1
1 000установок
ios-hig-design скилл Скилл помогает проектировать нативные iOS-интерфейсы в соответствии с Human Interface Guidelines Apple. Пригодится, когда вы делаете приложение для iPhone или iPad и хотите, чтобы оно выглядело как родное для платформы.
CX Codex +1
8 200установок
tailwind-4 скилл Скилл ведёт агента по стилизации на Tailwind CSS 4: что писать в className, когда нужен style, а когда cn(). Пригодится, если в проекте есть CSS-переменные и условные классы.
CX Codex +1
612установок
transitions-ui-generation скилл Скилл добавляет анимацию, будто агент строит интерфейс, заголовок или изображение. Пригодится для показа результата генерации на странице.
CX Codex +1
1 100установок
engineering-skills скилл Каталог инженерных скиллов для Claude Code: помогает выбрать роль под задачу и загрузить только нужный SKILL.md. Подходит для архитектуры, тестов, DevOps и работы с данными.
2 387установок
threejs-game-ui-designer скилл Скилл для проектирования игровых интерфейсов на Three.js: HUD, меню, экраны паузы и победы, адаптивная вёрстка для мобильных и десктопа. Помогает избежать наложений, обеспечить читаемость и согласованность со стилем игры.
CX Codex +1
3 300установок
threejs-gameplay-systems скилл Разворачивает игровой цикл на Three.js, Vite и TypeScript с контролем физики, ввода и камеры. Пригодится при сборке прототипов и настройке гейм-фила.
CX Codex +1
3 300установок
hairline-adopt скилл Пересобирает иконку или логотип из SVG в изометрическую линейную фигуру на движке @lucasmarkes/hairline, которая реагирует на указатель.
CX Codex +1
1 700установок
firecrawl-website-design-clone скилл Извлекает визуальную систему действующего сайта в DESIGN.md: токены, компоненты, логотип, шрифты и палитру.
CX Codex +1
33 100установок
threejs-gltf-loading скилл Загружает glTF и GLB в three.js и проигрывает запечённые клипы через AnimationMixer, включая сжатые DRACO, Meshopt и KTX2. Пригодится, когда модель вроде загрузилась, а на экране пусто.
CX Codex +1
5 900установок
angular-component скилл Скилл под Angular 20+ с сигнальными входами, OnPush и host bindings, помеченный как deprecated: гайд из него удалён, вместо него — официальные скиллы Angular.
CX Codex +1
11 500установок
react-navigation скилл Справочники по UI-паттернам React Navigation 7: стеки, табы, шторки, drawer, шапки, safe area. Пригодится, когда экраны и модалки надо разложить по навигатору.
CX Codex +1
4 800установок
orval скилл Генерирует типизированные клиенты, хуки TanStack Query, схемы Zod и моки MSW из спецификаций OpenAPI.
CX Codex +1
589установок
threejs-aaa-graphics-builder скилл Скилл переводит браузерную 3D-графику Three.js из прототипа в качественный продакшен: настраивает материалы, свет, шейдеры и проверяет сцену по шкале качества.
CX Codex +1
3 200установок
phaser-arcade-physics скилл Настраивает перемещение, прыжки и столкновения в 2D-играх на Phaser 4 через физический движок Arcade Physics. Помогает писать контроллеры и собирать группы объектов.
CX Codex +1
5 800установок
threejs-scene-setup скилл Настраивает базовую сцену three.js и помогает найти причины пустого или чёрного canvas. Нужен при старте проекта, ресайзе, цикле рендеринга и OrbitControls.
CX Codex +1
5 800установок
threejs-materials-lighting скилл Скилл для three.js: подбирает материал, ставит источники света, включает тени и подключает HDR-окружение, когда модель выглядит чёрной или плоской.
CX Codex +1
5 800установок
pixijs-rendering скилл Скилл для сборки слоя рендера на PixiJS v8: асинхронный Application, загрузка текстур, сцена на Container, тикер и события указателя.
CX Codex +1
5 600установок
threejs-debug-profiler скилл Ищет причины пустого экрана и сбоев рендера в браузерных играх на Three.js. Помогает замерить вызовы отрисовки и расход памяти без поломки геймплея.
CX Codex +1
3 100установок
svelte-core-bestpractices скилл Скилл объясняет агенту, как писать код на Svelte с рунами: $state, $derived, события, стили. Пригодится, когда агент правит компоненты в проекте на Svelte.
CX Codex +1
10 900установок
top-design скилл Скилл направляет агента на создание веб-интерфейсов уровня Awwwards с акцентной типографикой, выверенной анимацией и оценкой макета по десятибалльной шкале.
CX Codex +1
7 100установок
develop скилл Скилл превращает готовую спецификацию и правила AGENTS.md в код интерфейса или бэкенда. Пригодится, когда архитектура согласована и нужно писать код без самодеятельности агента.
CX Codex +1
4 400установок
threejs-qa-release скилл Проверяет браузерные игры на Three.js перед релизом: игровой цикл, адаптивность, сборку и визуальные артефакты. Нужен после изменений в механиках или перед публикацией.
CX Codex +1
3 000установок
vgpu скилл Скилл помогает создавать и отлаживать WebGPU-проекты на базе vgpu, опираясь на встроенную документацию установленного в проекте пакета.
CX Codex +1
1 600установок
display-glasses-with-jetpack-compose-glimmer скилл Правила разработки приложений для очков с дисплеем на Jetpack Compose Glimmer: темы, фокус, работа с аддитивным экраном.
CX Codex +1
1 500установок
remocn скилл Подбирает и устанавливает готовые анимации, переходы и UI-компоненты для роликов на Remotion. Нужен при сборке сцен из готовых частей.
CX Codex +1
1 700установок
html-wireframe скилл Скилл собирает низкодетальные HTML-каркасы экранов, чтобы проверить иерархию информации, навигацию и ход задачи ещё до визуального дизайна.
CX Codex +1
1 800установок
html-prototype скилл Скилл собирает один самодостаточный HTML-файл: статичный макет или рабочий прототип с состояниями, клавиатурой и адаптивом. Нужен, чтобы проверить решение по интерфейсу до кода.
CX Codex +1
1 800установок
microinteractions скилл Скилл про микровзаимодействия: состояния кнопок, отклик на ввод, индикаторы загрузки. Пригодится, когда интерфейс кажется «мёртвым», а причина не находится.
CX Codex +1
6 700установок
router-core скилл Скилл-навигатор по TanStack Router: разводит задачу по подскиллам и напоминает про вывод типов и клиентские лоадеры, на которых агенты ломаются.
CX Codex +1
589установок
guide скилл Помогает настроить библиотеку es-toolkit в проекте, подобрать правильный импорт и команду установки для текущего рантайма.
CX Codex +1
518установок
wp-interactivity-api скилл Помогает настраивать интерактивные блоки WordPress без сбоев гидратации. Пригодится при отладке директив, интеграции скриптов и синхронизации состояния между PHP и браузером.
CX Codex +1
4 200установок
generative-ui скилл Задаёт правила дизайн-системы для интерактивных HTML- и SVG-виджетов. Нужен, когда вместо текста агенту поручают показать графики, диаграммы или калькуляторы.
CX Codex +1
3 200установок
design-artifact скилл Набор правил для генерации аккуратных HTML-документов и отчётов. Избавляет вёрстку от стандартных клише ИИ вроде случайных карточек с акцентными линиями.
CX Codex +1
1 700установок
reka-ui скилл Скилл для работы с Reka UI — библиотекой unstyled компонентов Vue 3 с полной поддержкой доступности. Пригодится, если вы собираете интерфейсы с нуля или используете Nuxt UI и shadcn-vue.
CX Codex +1
7 400установок
561–600 из 2 909