NeVibeCode · 2 909 карточек
Скиллы по теме «Фронтенд и UI»
Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов.
angular-ssr скилл Скилл для задач Angular SSR, гидратации и пререндеринга. Он устарел: текущая версия больше не поддерживается.
CX Codex +1
3 900установок
create-canvas скилл Скилл собирает в проекте свободный холст, где варианты интерфейса или контента живут рядом, двигаются и сравниваются без перезагрузки страницы.
CX Codex +1
381установок
code-to-prd скилл Скилл превращает кодовую базу в PRD с описанием страниц, маршрутов, API и пользовательских действий. Подходит для аудита существующего проекта.
763установок
roku скилл Задаёт агенту правила дизайн-системы приложения: фиолетовая палитра, верхняя навигация, карточные раскладки. Пригодится, когда интерфейс нужно привести к одному виду.
CX Codex +1
2 000установок
power скилл Задаёт агенту правила тёмного интерфейса: крупные заголовки, монохромная палитра, токены и проверки доступности. Пригодится, когда нужен строгий вид без ручной вычитки стилей.
CX Codex +1
2 000установок
geometric скилл Задаёт правила геометрической дизайн-системы с нейтральными цветами и шрифтами Inter. Пригодится при сборке интерфейсных компонентов и гайдлайнов под WCAG 2.2 AA.
CX Codex +1
2 000установок
stitch скилл Скилл задаёт правила для интерфейсов с данными: токены, состояния компонентов, доступность и QA-проверки. Пригодится для согласованного UI.
CX Codex +1
2 000установок
data-table-filters скилл Скилл помогает собирать React-таблицы с фильтрами, сортировкой, виртуализацией и бесконечной прокруткой. Пригодится для проектов на shadcn.
CX Codex +1
476установок
web3d-integration-patterns скилл Скилл помогает проектировать 3D-сцены, где Three.js, React Three Fiber и библиотеки анимации работают вместе. Пригодится для scroll-driven и physics-based интерфейсов.
CX Codex +1
3 200установок
globe-gl скилл Скилл помогает настраивать 3D-глобусы через библиотеку globe.gl на ThreeJS и WebGL. Пригодится при отрисовке точек, дуг и полигонов на карте в чистом HTML или React.
CX Codex +1
1 500установок
vantajs скилл Помогает добавить анимированный фон на Vanta.js и настроить его в статическом сайте, React или Next.js.
CX Codex +1
1 500установок
atmosphere-background скилл Скилл для генерации тёмного атмосферного фона: вертикальные световые складки медленно дрейфуют, свечение складывается в углу или у нижнего края.
CX Codex +1
1 500установок
editorial-tech скилл Задаёт правила вёрстки на стыке журнальной графики и строгого интерфейса: асимметричная сетка, панорамные медиа-полосы, моноширинные метки и один акцентный цвет.
CX Codex +1
1 500установок
css-alpha-masking скилл Скилл добавляет CSS-маски с градиентным исчезновением по краям. Пригодится для плавного скрытия краёв изображений, текста и контейнеров.
CX Codex +1
1 500установок
stitched-full-page-capture скилл Скилл собирает полный скриншот страницы из кусков вьюпорта, когда обычный fullPage даёт пустоту. Пригодится на Framer, WebGL и сайтах с ленивой загрузкой.
CX Codex +1
1 500установок
glass-dark-ui скилл Настраивает тёмный глассморфизм с матовыми панелями и градиентными рамками через CSS-маски. Пригодится для карточек, дашбордов и модальных окон в React или Tailwind.
CX Codex +1
1 500установок
build-threejs-scroll-worlds скилл Скилл помогает собирать интерактивные Three.js-миры, где нативный скролл ведёт через несколько сцен. Нужен для 3D-сторителлинга и пространственных веб-историй.
CX Codex +1
1 500установок
container-lines скилл Скилл добавляет тонкие вертикальные линии по краям контентного контейнера и мини-квадраты в углах секций. Пригодится, когда макет выглядит рыхлым и нужен каркас.
CX Codex +1
1 500установок
company-logos скилл Скилл настраивает добавление логотипов брендов через Iconify Simple Icons в сетке 64x64 вместо текстовых названий и случайных картинок.
CX Codex +1
1 500установок
matterjs скилл Помогает агенту собрать сцену на Matter.js: движок, рендер, тела, ограничения и перетаскивание мышью. Пригодится, когда нужна физика на canvas.
CX Codex +1
1 500установок
css-border-gradient скилл Добавляет в веб-интерфейс аккуратные градиентные рамки через CSS или Tailwind. Пригодится карточкам цен, модальным окнам и кнопкам, которым нужна сдержанная подсветка контура.
CX Codex +1
1 500установок
scroll-scrubbed-visual-sequence скилл Собирает обратимые визуальные сцены, управляемые прокруткой: от сборки продукта до смены состояний интерфейса. Пригодится для интерактивных hero-блоков и диаграмм.
CX Codex +1
1 500установок
unsplash-asset-images скилл Скилл подбирает фотографии Unsplash под аватары, хедшоты, фоны и обои и сразу называет нужные пропорции и разрешения.
CX Codex +1
1 600установок
scroll-world-storytelling скилл Скилл превращает статьи, кейсы и продуктовые истории в кинематографичные скролл-лендинги. Пригодится, когда вместо скучных блоков нужен связный визуальный мир.
CX Codex +1
1 600установок
staggered-word-reveal скилл Создаёт пословное появление короткого текста при прокрутке. Подходит для заголовков, подзаголовков, цитат и вступительных блоков.
CX Codex +1
1 600установок
landing-page-generator скилл Создаёт лендинги в виде TSX-компонентов Next.js/React с Tailwind CSS. Нужен для маркетинговой страницы, главной или вариантов для A/B-теста.
754установок
navigation-event скилл Помогает внедрить библиотеку androidx.navigationevent в Compose Android. Настраивает предиктивную анимацию жеста «Назад» и заменяет устаревший BackHandler.
CX Codex +1
546установок
typography-scale скилл Строит модульную типографическую шкалу: размеры, насыщенность, межстрочный интервал. Пригодится, когда верстаете дизайн-систему с нуля.
CX Codex +1
2 600установок
flutter-animations скилл Скилл для работы с анимациями во Flutter: добавить, починить, отрефакторить или объяснить движение в интерфейсе.
CX Codex +1
15 400установок
ios-accessibility скилл Помогает настраивать доступность в приложениях под iOS и macOS, проверяя разметку для экранных дикторов и системные параметры интерфейса. Пригодится при подготовке релиза и аудите компонентов.
CX Codex +1
4 900установок
remotion-render скилл Скилл отдаёт TSX-компонент Remotion в inference.sh и получает готовый MP4. Пригодится, когда видео нужно собирать кодом, а не руками в редакторе.
CX Codex +1
109 700установок
ui-screenshots
официальный скилл Скилл снимает скриншоты веб-приложений и десктопных окон, чтобы показать изменения интерфейса до и после правок кода.
209установок
bencium-impact-designer скилл Создаёт фронтенд-интерфейсы с выраженным визуальным направлением. Нужен для компонентов, страниц и веб-приложений, когда типовой стиль не подходит.
CX Codex +1
5 400установок
nuxt-content скилл Скилл для работы с @nuxt/content: коллекции, схемы, запросы и рендер Markdown. Пригодится, когда проект на Nuxt растёт и контент пора приводить к типам.
CX Codex +1
2 800установок
square скилл Скилл задаёт агенту правила дизайн-системы Square: токены, типографику, состояния компонентов и критерии доступности. Пригодится, когда интерфейс надо привести к одному стилю.
CX Codex +1
2 000установок
pulse скилл Задаёт правила дерзкой дизайн-системы Pulse с рамками 4px, яркой оранжевой палитрой и шрифтом Limelight. Помогает писать дизайн-гайды и проверять компоненты на WCAG 2.2 AA.
CX Codex +1
2 000установок
basic скилл Скилл задаёт редакционный дизайн для книг, журналов и отчётов: сетку, типографику, токены и правила доступности. Пригодится для UI с печатной эстетикой.
CX Codex +1
2 000установок
color-system скилл Скилл собирает палитру продукта: тональные шкалы, семантические роли и проверку контраста по WCAG. Пригодится, когда цвета задают с нуля или переделывают.
CX Codex +1
2 500установок
visual-hierarchy скилл Скилл выстраивает визуальную иерархию интерфейса через размер, насыщенность, цвет, отступы и позицию. Пригодится при создании новых экранов.
CX Codex +1
2 500установок
animated-component-libraries скилл Скилл помогает добавлять готовые анимированные React-компоненты из Magic UI и React Bits. Пригодится при вёрстке лендингов, дашбордов и промо-страниц без ручной сборки анимаций на Framer Motion.
CX Codex +1
2 900установок
801–840 из 2 909
