NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
frontend-design skill Generates production-grade UI based on established design philosophies. It checks existing tokens and components before writing any new code.
CX Codex +1
5,500installs
shadcn-ui skill A skill that tells the agent how to install and configure shadcn/ui components: buttons, dialogs, tables, and forms with React Hook Form and Zod.
CX Codex +1
22,400installs
senior-qa skill This skill creates unit, integration, and E2E test stubs for React and Next.js. Use it to inspect coverage and set up a testing workflow.
1,178installs
router-plugin skill Configures the TanStack Router bundler plugin for route generation and code splitting. Works across Vite, Webpack, Rspack, and esbuild setups.
CX Codex +1
339installs
design-brief skill Interviews you about a feature, scans the codebase, and saves a design brief as markdown. Useful before you start building a page.
CX Codex +1
5,300installs
brief-to-tasks skill Converts a design brief into an ordered checklist of vertical slice tasks and saves it as a markdown file.
CX Codex +1
5,200installs
design-flow skill Walks you from clarifying questions to built components across six phases, confirming before each next step.
CX Codex +1
5,300installs
beui skill Selects and installs animated React components from beUI via MCP or shadcn registry. Useful when building agent interfaces, chats, and motion UI.
CX Codex +1
844installs
angular-directives skill An Angular directives skill that is no longer maintained. The Angular team now ships official skills instead.
CX Codex +1
5,700installs
angular-di skill A dependency injection skill for Angular v20+ using inject() and tokens. The analogjs team deprecated this package and cleared its instructions.
CX Codex +1
5,700installs
migrate-oai-app skill Guides developers migrating interactive widgets from OpenAI Apps SDK to MCP Apps SDK. Rewrites synchronous OpenAI calls into asynchronous MCP event handlers.
CX Codex +1
1,100installs
threejs-webgl skill Configures coding agents to build Three.js scenes, set up WebGL or WebGPU renderers, adjust lighting, and load glTF models for web 3D apps.
CX Codex +1
4,600installs
beautiful-shadows skill A skill that hands your agent three exact Tailwind arbitrary shadow classes for cards, panels and popovers. Useful when default shadow-sm and shadow-lg look blunt.
CX Codex +1
2,200installs
leanback-to-compose-tv-migration skill A skill that guides the move from Leanback and Android Views to Jetpack Compose for TV. Useful when a browse, settings or playback screen needs rewriting.
CX Codex +1
772installs
ui-design-system skill This skill builds design tokens, component structures, and responsive calculations. Use it when a project needs a consistent UI system or a developer handoff.
1,076installs
glassmorphism skill Guides the agent in creating glassmorphism design system rules with translucent layers, blur, and high contrast. Fits teams building bento cards compliant with WCAG 2.2 AA.
CX Codex +1
2,900installs
cinematic-scroll-storytelling skill Generates scroll-driven landing page animations using Lenis and GSAP ScrollTrigger. It helps structure editorial storytelling, sticky card stacks, and masked typography reveals.
CX Codex +1
2,100installs
blog-chart skill Builds inline SVG charts for blog posts in HTML or MDX. The orchestrator calls it automatically when resolving data markers during blog-write runs.
CX Codex +1
2,500installs
angular-tooling skill A skill for driving Angular CLI in Angular v20+ projects: scaffolding, code generation, builds and tests. It is no longer maintained.
CX Codex +1
5,200installs
ui skill Picks the right Unity UI system for a request and hands it to a matching skill. Useful when someone asks for a menu or panel without naming a framework.
CX Codex +1
5,000installs
premium skill Sets Apple-inspired design-system guidance for tokens, spacing, typography and accessibility. Use it when building or aligning an interface.
CX Codex +1
2,700installs
editorial skill A skill that turns your agent into an editorial design-system author: serif type scale, 8pt grid, color tokens, component states and accessibility checks.
CX Codex +1
2,700installs
react-native-unistyles-v3 skill A skill that walks the agent through react-native-unistyles v3: Babel or Metro setup, themes, breakpoints, variants and common breakages.
CX Codex +1
529installs
bencium-innovative-ux-designer skill A skill that develops an independent visual language: ten typography-led HTML directions, a human pick, then production.
CX Codex +1
7,500installs
d3k skill Runs a project dev server and a monitored browser with a shared chronological event timeline. Helps developers and agents debug local web app issues.
CX Codex +1
859installs
threejs skill Guides your agent through building and debugging interactive Three.js scenes: scene, camera, lights, glTF loading, controls and performance.
CX Codex +1
2,000installs
animation-on-scroll skill A skill that wires up scroll-reveal with IntersectionObserver, plus Tailwind animation classes and keyframes.
CX Codex +1
2,000installs
preline-mcp skill The skill wires up the Preline MCP server so your agent can drop Preline UI components and blocks straight into your HTML files.
CX Codex +1
349installs
convert-web-app skill Guides the conversion of an existing web app into an MCP App while retaining standalone browser use. It fits SPAs and pages with an existing UI.
CX Codex +1
966installs
threejs-performance skill This skill helps diagnose slow three.js scenes through render counters, memory metrics, CPU timing, shadows and GPU work. Use it when frames drop or memory climbs.
CX Codex +1
1,400installs
wp-patterns skill Creates and updates WordPress block patterns, then checks registration and markup. Useful for templates, starter pages, and Query Loop layouts.
CX Codex +1
2,200installs
landing-page-guide-v2 skill A skill that walks the agent through aesthetic direction, a design system and 11 must-have landing page elements. Code comes out as Next.js 14+ with ShadCN UI.
CX Codex +1
1,300installs
clerk skill Reads your Clerk question and routes it to the right sub-skill: setup, CLI, framework patterns, billing, webhooks.
CX Codex +1
30,000installs
a11y-audit skill Scans web projects for WCAG 2.2 Level A and AA issues, suggests fixes, then checks the result again. Use it before a release or when adding accessibility checks to CI/CD.
970installs
macos-design-guidelines skill Supplies Apple Human Interface Guidelines for macOS apps in SwiftUI and AppKit. Useful when setting up menus, window controls, and keyboard shortcuts.
CX Codex +1
4,300installs
animation-systems skill Motion design guide for clean, product-grade web animations like Stripe, Linear, and Apple. Useful when building UI transitions, hover states, and modals.
CX Codex +1
1,900installs
payload skill Guides Payload CMS development across collections, hooks, and access control. Useful when debugging queries, validation, and database transactions.
CX Codex +1
6,900installs
bento skill A skill for bento-style interfaces with modular cards, clear hierarchy, and soft spacing. Use it when an AI agent needs concrete UI and design-system guidance.
CX Codex +1
2,500installs
enterprise skill This skill gives your agent a dark design system for data dashboards: modular grids, glass-like panels, tokens and accessibility rules. Useful when the agent builds UI for monitoring and analytics.
CX Codex +1
2,500installs
clean skill Generates minimal design system guidelines using an 8pt grid, strict color tokens, and WCAG 2.2 AA accessibility rules.
CX Codex +1
2,600installs
681–720 of 2,909
