NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
playwright-e2e-testing skill A skill for writing and maintaining Playwright E2E specs in TypeScript: user flows, forms, auth, API mocking and visual comparisons.
CX Codex +1
615installs
web-frameworks skill A skill group for full-stack work: it gives the agent references for Next.js, Turborepo monorepos and RemixIcon so it stops guessing at project structure.
CX Codex +1
372installs
fire-paper-loader skill Builds a burning-paper ring loader using WebGL 1 and OffscreenCanvas in a Worker. The flame animation keeps moving even when heavy JavaScript blocks the main thread.
CX Codex +1
319installs
shopify-theme-optimization skill A skill that audits Shopify theme speed and UX: Core Web Vitals, Liquid, image loading, mobile layout. Returns a step-by-step plan.
CX Codex +1
1,100installs
brand-visual-generator skill A skill that helps define or audit visual identity: typography, color palette, spacing, design tokens and frontend aesthetics.
CX Codex +1
1,400installs
nextjs-react-typescript skill A skill that sets code style for Next.js App Router, React, TypeScript, Shadcn UI and Tailwind. The agent writes functional components, server-first, with TypeScript interfaces.
CX Codex +1
5,200installs
design-loop skill The skill runs a baton-passing loop: it reads a task from a file, generates an HTML/Tailwind page, wires it into the site, then writes the next task.
CX Codex +1
1,000installs
macos-notch-ui skill Build a macOS panel that opens from the screen notch. Use it for a recording indicator or another compact status display.
CX Codex +1
557installs
tailwind-css skill Guides coding agents on Tailwind CSS styling, v4 migrations, and class updates while enforcing real build checks and DOM inspection.
CX Codex +1
3,000installs
yyl-remotion-video skill Turns an article, script or notes into a Remotion project and renders mp4. Useful when you need a video file, not a web presentation.
CX Codex +1
503installs
ui-components skill Supplies component library rules for shadcn/ui and Radix Primitives. It guides agents on v4 styles, OKLCH theming, CVA variants, and Zod form validation.
CX Codex +1
1,500installs
nuxt-i18n skill A skill that walks your coding agent through @nuxtjs/i18n setup: locales, translated routes, language detection and locale SEO.
CX Codex +1
589installs
playwright-core skill Provides battle-tested Playwright patterns for E2E, API, and component tests in TypeScript and JavaScript. Helps debug flaky runs, configure fixtures, and structure test suites.
CX Codex +1
778installs
ui-craft-dense-dashboard skill Locks an agent into a data-first style for admin panels and analytics views: tight grid, mono numbers, semantic colors. Useful when the UI is built for an operator, not a landing page.
CX Codex +1
1,200installs
uni-app skill A skill that feeds your agent a structured uni-app reference: components, APIs and build rules for iOS, Android, HarmonyOS, web and mini-programs.
CX Codex +1
2,000installs
design skill Design skills for Apple platform UI: Liquid Glass, animations, game feel, UX writing, SF Symbols and typography. Useful when a screen feels flat and you need a plan.
CX Codex +1
677installs
zustand-patterns skill A reference for Zustand 5.x state management: slices, middleware, Immer, useShallow, persistence and devtools. Useful when you want to drop Redux without the boilerplate.
CX Codex +1
1,400installs
odoo-18 skill Odoo 18 development reference for AI agents. It guides coding for Python ORM models, OWL components, XML views, reports, and security rules.
CX Codex +1
1,500installs
astro-framework skill A skill that turns your coding agent into a senior Astro engineer. Useful once a content site needs islands, server rendering or the Content Layer API.
CX Codex +1
2,200installs
react-pdf skill Builds PDF documents using the @react-pdf/renderer library. Use it to render invoices, reports, and forms directly from TypeScript code.
CX Codex +1
751installs
om-ux-setup skill Pulls your repository's design system into .uxproof/ so UX skills judge code against your rules, not a built-in one.
CX Codex +1
2,500installs
om-ux-review-pr skill Reviews UI changes in a real browser, tests user flows, and posts impact-ranked design findings with screenshot evidence.
CX Codex +1
2,600installs
nextjs-seo skill Audits and implements SEO for Next.js App Router, from metadata to indexing diagnosis. Use it when changing search-facing pages or investigating production behavior.
CX Codex +1
2,400installs
mantine-form skill A skill for building forms with @mantine/form: validation rules, zod and valibot schemas, nested fields and arrays. Useful when your agent writes Mantine forms.
CX Codex +1
2,700installs
open-graph skill Configures and audits Open Graph metadata for social preview cards. Useful when setting up tags in plain HTML or Next.js App Router.
CX Codex +1
1,200installs
sentry-svelte-sdk skill A skill that walks your agent through full Sentry setup in Svelte and SvelteKit: it scans the project, proposes a feature set and writes the config files.
CX Codex +1
2,100installs
sap-fiori-guidelines skill A skill that feeds your agent the official SAP Fiori design system rules: buttons, forms, tables, page types, colors, accessibility and Joule patterns.
CX Codex +1
1,200installs
motion-dev-animations skill Generates GPU-accelerated Motion.dev animations for React, Next.js, Svelte, and Astro. Implements spring physics, gesture handling, and scroll reveals with accessibility checks.
CX Codex +1
594installs
ue-ui-umg-slate skill Guides AI coding agents when writing or fixing Unreal Engine 5.8 UI in C++, covering UMG, Slate, Common UI, and MVVM.
CX Codex +1
1,400installs
navigation-menu-generator skill A deprecated compatibility skill for navigation menu construction. It points to Bricks where the component is now maintained.
CX Codex +1
1,100installs
favicon-generator skill Walks through favicon and app icon setup: sizes, formats, HTML tags and what Google Search expects from the icon.
CX Codex +1
1,100installs
affiliate-page-generator skill Deprecated compatibility stub for affiliate program page generation. Page construction rules now live in the page-builder skill within Pagina.
CX Codex +1
1,100installs
mobile-friendly skill Audits the mobile version of a page: viewport, font size, tap targets, content parity with desktop. Useful when Google indexes the mobile version instead.
CX Codex +1
1,100installs
twitter-cards skill Sets up and audits Twitter and X Card metadata for link previews in social feeds.
CX Codex +1
1,100installs
core-web-vitals skill This skill diagnoses LCP, INP, and CLS problems and turns them into prioritized fixes. Use it when page performance or technical SEO needs a closer look.
CX Codex +1
1,100installs
image-optimization skill Guides responsive image markup, WebP compression, and sitemaps for Google Search. Use it to fix LCP regressions and prepare site assets for search indexing.
CX Codex +1
1,100installs
miniprogram-development skill Guides the creation, debugging, preview, and deployment of WeChat Mini Programs. Ideal when configuring project structure, CloudBase, and wechatide CLI workflows.
CX Codex +1
4,400installs
lynx-devtool skill Controls Lynx apps on Android, iOS, and Desktop using the agent-lynx CLI. Useful for inspecting DevTool sessions, ReactLynx trees, and running snapshot actions.
CX Codex +1
6,200installs
react-hook-form skill Optimizes client-side forms using React Hook Form 7.82.0 and prevents unnecessary re-renders across field subscriptions, validation, and controlled UI inputs.
CX Codex +1
3,000installs
sentry-tanstack-start-sdk skill Configures Sentry SDK in TanStack Start React applications. It inspects project files to set up error monitoring, tracing, logs, and session replay across browser and server.
CX Codex +1
1,900installs
1,321–1,360 of 2,909
