NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
nextjs-app-router-fundamentals skill A skill that walks the agent through Next.js App Router: Pages Router migration, nested layouts, metadata, dynamic routes. Useful when moving to app/.
CX Codex +1
2,200installs
playwright-blazor-testing skill A skill that walks your agent through Playwright end-to-end tests for Blazor Server and WebAssembly: navigation, forms, auth, selectors.
CX Codex +1
537installs
vega-multi-tv-migration skill Migrates Vega OS Fire TV apps into a multi-platform React Native monorepo. It helps share code across Android TV, Apple TV, and Vega OS.
CX Codex +1
10,400installs
tesseract-editor skill Build or change a browser-based editor for Tesseract .tsrct projects. The skill covers interface controls, previews, and saving project data.
CX Codex +1
1,200installs
r3f-fundamentals skill Skill that teaches the agent to build React Three Fiber scenes: Canvas, typed JSX, render-loop hooks, and resource ownership. For scene architecture, not detailed materials.
CX Codex +1
2,100installs
app-ui-design skill A skill for designing iOS and Android interfaces: design systems, accessibility, platform guidelines. Useful when the agent lays out screens or checks contrast.
CX Codex +1
636installs
posthog-analytics skill A skill for wiring PostHog product analytics into your project: event tracking, user identification, feature flags and dashboards. Useful when you need to add tracking.
CX Codex +1
809installs
sentry-react-router-framework-sdk skill Guides the setup of error monitoring and tracing in React Router v7 framework apps. Useful when installing and configuring @sentry/react-router.
CX Codex +1
1,800installs
emilkowal-animations skill A set of 58 web animation rules based on Emil Kowalski's work for React and Framer Motion. Helps tune easing curves, gestures, and UI timing.
CX Codex +1
2,800installs
phaser skill A skill that gives your agent a working structure for Phaser 3 browser games: scenes, shared state, an event bus. Useful when starting a game or adding mechanics to one.
CX Codex +1
1,400installs
download-page-generator skill Deprecated compatibility skill for creating download pages. It points AI agents to the successor tool, page-builder in Pagina.
CX Codex +1
1,000installs
toc-generator skill A compatibility stub: table of contents building now lives in Bricks, and this skill only points you to the successor.
CX Codex +1
1,000installs
services-page-generator skill Deprecated compatibility stub for building service pages. It notifies that instructions moved to Pagina and directs users to page-builder.
CX Codex +1
1,000installs
popup-generator skill A deprecated compatibility entry that points modal creation to Bricks. Useful when updating legacy agent configurations to component-builder.
CX Codex +1
1,000installs
social-share-generator skill Deprecated compatibility entry for building social share components. Points to the successor skill component-builder in the Bricks repository.
CX Codex +1
1,000installs
tab-accordion skill A compatibility stub for tabs and accordion construction. The component rules moved to Bricks, so the skill itself builds nothing.
CX Codex +1
1,000installs
audit skill Runs a technical UI audit across accessibility, performance and responsiveness, then hands back a prioritized findings table.
CX Codex +1
929installs
sap-fiori-tools skill A skill for building SAP Fiori apps: template generation, Page Editor setup, annotations, ABAP or Cloud Foundry deployment, driven from the agent.
CX Codex +1
1,200installs
shiny-bslib skill A skill for building Shiny dashboards with bslib and Bootstrap 5. Useful when moving an older app onto the newer components.
CX Codex +1
801installs
angular-performance skill An Angular skill that tells the agent how to load images with NgOptimizedImage, defer heavy components with @defer, and set up SSR with hydration.
CX Codex +1
350installs
frontend-enhancer skill A Next.js skill with ready React components, six color palettes, CSS animations and section templates. Useful when the interface needs a visual pass.
CX Codex +1
968installs
swiftui-whats-new-27 skill A reference skill covering SwiftUI API updates across 2027 Apple platforms. It prevents build failures when @State transitions to a macro and guides migration.
CX Codex +1
737installs
qt-qml-docs skill Reads .qml sources and related project files, then writes a Markdown reference per component: properties, signals, methods, dependencies.
CX Codex +1
719installs
r3f-animation skill Skill for smooth animation of 3D objects in React Three Fiber using useFrame, damping, and GLTF clips. Useful for procedural motion, state transitions, and on-demand animation control.
CX Codex +1
2,000installs
frontend-testing-best-practices skill A set of 6 testing guidelines that prioritizes Playwright E2E workflows over isolated React component tests and heavy mocking.
CX Codex +1
2,200installs
rsbuild-best-practices skill Provides rules for configuring, reviewing, and troubleshooting Rsbuild applications. Helps agents inspect builds, handle assets, and profile performance.
CX Codex +1
2,700installs
mjml-email-templates skill A skill that gets your agent writing transactional emails in MJML and compiling them to HTML that holds up in Outlook, Gmail and Apple Mail.
CX Codex +1
492installs
ui-craft-minimal skill Enforces a clean editorial UI aesthetic inspired by Linear, Notion, and Vercel. Locks layouts to monochrome palettes, generous whitespace, and minimal motion.
CX Codex +1
903installs
vocabulary skill A reverse dictionary for UI and product design that turns loose descriptions into exact terminology and resolves confusing near-synonyms.
CX Codex +1
1,100installs
ui-craft-editorial skill Configures AI coding agents for editorial and long-form web design. It enforces magazine typography, warm backgrounds, OpenType features, and relaxed reading geometry.
CX Codex +1
898installs
qt-qml-profiler skill This skill profiles 2D QML apps and inspects .qtd traces to locate performance bottlenecks. Use it when a Qt Quick interface stutters or you need to investigate rendering, bindings, or signals.
CX Codex +1
701installs
colorize skill The skill places one accent in 3–5 spots on a screen, or strips an over-colored UI back to a neutral base.
CX Codex +1
890installs
heuristic skill Scores a UI against Nielsen's 10 heuristics and 6 design laws, then returns a markdown scorecard and a 0-100 UsabilityScore.
CX Codex +1
881installs
frontend-visual-qa skill Checks the interface you can actually see in a real browser: typography, overflow, responsive layout, routes, charts. Useful right after UI work, when the build passes but nobody looked.
CX Codex +1
572installs
shiny-bslib-theming skill A skill that walks your agent through Shiny app theming with bslib and Bootstrap 5: presets, colors, fonts, dark mode and live tweaking.
CX Codex +1
750installs
r3f-materials skill Guides the agent in configuring PBR and transparency in React Three Fiber. Prevents texture color space mistakes and unnecessary GPU overhead.
CX Codex +1
1,900installs
r3f-postprocessing skill A skill that walks the agent through postprocessing in React Three Fiber: glow on chosen meshes, depth of field, SSAO. Useful when the render looks off and you cannot pin down why.
CX Codex +1
1,900installs
game-audio skill Generates procedural background music and sound effects for browser games using Web Audio API. Needs zero external assets or npm packages.
CX Codex +1
1,300installs
shape skill A wireframe-first pass that turns a vague screen brief into an ASCII layout, state list, content inventory and open questions before any code is written.
CX Codex +1
867installs
foundry-hosted-agent-copilotkit
official skill Connects a CopilotKit React frontend to a Microsoft Agent Framework agent in Microsoft Foundry via the AG-UI protocol. Helps connect and deploy agentic web apps.
29installs
1,361–1,400 of 2,909
