Next.js plugins

Searchable database of UI/UX design rules and assets covering styles, color palettes, typography, accessibility, animation, and charts across 22 technology stacks. Includes tools for generating design tokens, brand identity, presentations, and accessible UI components with Tailwind and shadcn/ui.

Orchestrate 1,388 specialized AI skills in Claude Code to automate expert workflows for Azure SDK integrations, Odoo/Shopify configs, SEO audits, security pentests, full-stack scaffolding, agent building, and DevOps pipelines across Python, React, AWS, Kubernetes.

Implements Next.js cache components and Partial Prerendering (PPR) with 'use cache' directive, cacheLife(), and cacheTag() for cache invalidation and parameter permutation rendering.

Search a database of UI/UX design rules covering styles, colors, typography, accessibility, animation, and chart types across 22 technology stacks to guide design and review decisions.

Build and scaffold production-ready frontend and mobile applications with Next.js, React Native, and Flutter. Includes patterns for state management, design systems with Tailwind CSS, and cross-platform development with performance optimization and accessibility.

Write modern JavaScript/TypeScript applications using ES6+ patterns and advanced type safety, build Node.js backends with Express/Fastify, implement testing with Jest/Vitest, and scaffold projects for Next.js, React, and CLIs.

Accelerate full-stack development with 66 specialized skills covering 12 languages, frontend/backend frameworks, infrastructure, DevOps, security, and testing, plus Jira/Confluence project management commands for epic planning, discovery, and retrospectives.

Orchestrate cross-platform feature development across web, iOS, Android, and desktop with API-first design, shared business logic, and parallel platform implementation using specialized agents for backend, frontend, mobile, and design systems.

Optimizes web content for search engines by generating SEO metadata, analyzing keyword density, structuring content headings and schema, and formatting content for featured snippets and SERP features, with platform-specific configurations for WordPress, Astro, and Next.js.

Profile, optimize, and monitor application performance across frontend and backend systems using OpenTelemetry, Prometheus, Grafana, and Datadog. Includes React/Next.js optimization, caching, load testing, and observability setup with SLI/SLO management.

Guides frontend web development with skills for building distinctive designs, optimizing React/Next.js performance, implementing SEO best practices, and improving form conversion rates. Covers modern patterns for Server Components, Tailwind CSS v4, and React hooks.

Provides expert guidance and patterns for TypeScript and JavaScript development, covering full-stack React/Next.js (App Router, Server Components, performance) and Node.js (framework selection, async patterns, security). Helps debug complex type issues, optimize bundle size, and modernize codebases.

Guides full-stack development with opinionated best practices for API design (REST/GraphQL/tRPC), layered backend architecture (Express/TypeScript/Prisma), database schema and ORM selection, React/Next.js frontend components, and Stripe payment integration. Includes project scaffolding and code quality checks.

Provides a team of specialized expert agents that each deep-dive into specific languages and frameworks—from Angular and React to Rust, Go, Java, Swift, and more—so you can delegate complex, language-specific tasks like architecture design, performance optimization, and enterprise patterns to the right expert on demand.

Integrate third-party APIs for search, CRM, payments, fintech, and communications with expert patterns covering authentication, webhooks, SDK usage, and compliance.

Guides developers through the full lifecycle of launching and monetizing a SaaS product, from MVP development and payment integration to product analytics, email marketing, referral programs, pricing strategies, and SEO optimization.

Scan frontend codebases for XSS vulnerabilities and implement secure coding patterns across React, Vue, Angular, and mobile apps with expert agents for both security fixes and general frontend development

Integrate payment processing, subscription management, and commercial CRM workflows: Stripe subscriptions, PayPal transactions, Plaid financial data, HubSpot CRM automation, and Algolia search-powered product discovery.

Enforce a consistent v1 frontend design taste across React, Next.js, and Tailwind projects with configurable variance, motion, and density parameters, preserving backward compatibility for existing codebases.

Integrate payment processing, CRM, communication, search, and financial APIs with expert patterns for Stripe, HubSpot, Twilio, Algolia, and Plaid, including webhooks, OAuth, and event-driven architectures.

Automate localization and international growth workflows: i18n audits, hreflang validation, structured data optimization, SEO content strategy, market research, and analytics tracking.

Get expert guidance on modern JavaScript, TypeScript, Node.js, Next.js, and React—covering architecture, performance, async patterns, and code quality across the full stack.

Accelerate development of React/Next.js web apps with integrated patterns for component design, state management, Server Components, performance optimization, and design systems using Tailwind CSS and shadcn/ui. Includes audits for form conversion, SEO, and WCAG accessibility compliance.

Audit and optimize frontend web applications with expert guidance on accessibility compliance, form conversion, design systems, React/Next.js patterns, performance tuning, SEO, and Tailwind CSS — all in one skill bundle.

Enables full-stack development with guided patterns for API design, authentication, backend architecture, database schema, React/Next.js frontend, testing, and Stripe payment processing.

Apply Vercel's curated React, Next.js, and React Native best practices for performance, rendering, animations, and state management. Deploy and audit Vercel projects, review UI accessibility and design, and check documentation against Vercel writing guidelines.

Develop Payload CMS projects with inline reference for collections, fields, hooks, access control, and API queries, plus debugging support for validation, security, and relationships.

Build, integrate, and debug AI-powered chat and agent features in CopilotKit projects, from setup to production across frontend and backend.

Implement Next.js 14+ App Router patterns for Server Components, streaming, parallel routes, data fetching, and Server Actions to build or migrate Next.js applications.

Automate 90+ Korean daily-life and business tasks: book KTX/SRT trains, search Coupang/Daangn, check real estate prices, look up laws, track parcels, and more via public APIs and browser automation.

Build mobile apps, frontend pages, and full-stack features while generating AI media (images, video, music, stickers) and documents (PDF, DOCX, PPTX, XLSX) via MiniMax APIs. Includes guides for Android, iOS, Flutter, React Native, and shader effects.

Delegate full-stack development workflows to Claude via 213 specialized agents, commands, and skills: refactor code, generate tests/deployments/Dockerfiles/K8s manifests, audit security/performance, document APIs/onboarding, orchestrate Git ops, and apply patterns across JS/TS/Python/Rust/Go/Java stacks.

Build and optimize GSAP animations with AI guidance across React, Vue, Svelte, and vanilla JS — covers tweens, timelines, ScrollTrigger, plugins, performance, and framework-specific patterns.

Render JSON UI/document specs to web, mobile, terminal, PDF, images, video, and email. Supports React, Vue, Svelte, Next.js, Remix, React Native, and state management adapters. Enables AI-generated UIs and component catalogs.

Build generative UI components that AI agents can control, by integrating Tambo into React/Next.js apps with Zod-schema component registration and provider setup, or scaffolding new apps from natural language prompts.

Deploy a team of expert coding agents for software architecture, backend/frontend development, mobile apps, CMS platforms (Directus, Drupal, WordPress), and legacy modernization — each specialized in specific frameworks and best practices.

Design and export App Store and Google Play marketing screenshots with device frames, drag-to-reorder, and bulk PNG export using a Next.js + ShadCN editor.

Autonomous multi-agent development framework that orchestrates spec-driven sprints: agents plan, implement, test, and review code in parallel across frontend, backend, and CI/CD, converging on a finished feature without manual handoffs.

Configure, test, deploy, and maintain Clerk authentication in Next.js applications. Includes SDK setup, sign-in/sign-up flows, route protection, E2E testing with Playwright in CI/CD, production deployment (Vercel/Netlify), error debugging, and security best practices.

Scaffold and extend full-stack TypeScript monorepos using Better-T-Stack, with an agent that designs a valid stack from a product description and an MCP server that generates project files or adds addons like PWA, Tauri, and Biome.

Manage full Vercel deployment lifecycle: previews, production rollouts, CI/CD pipelines, edge functions, cost optimization, incident response, security hardening, and migrations from other platforms.

Optimize Postgres queries and schema designs with Supabase best practices, manage authentication and RLS, and access Supabase documentation via MCP for any Supabase project.

Build and manage data portals with PortalJS: scaffold a portal, add datasets (CSV, GeoJSON, etc.), create charts and maps, connect CKAN backends, migrate from ArcGIS/Socrata/other platforms, deploy to Cloudflare, and audit data quality.

Manage skills, agents, and commands for Claude Code with a unified hub that provides 150+ capabilities including code review, TDD enforcement, git workflows, UI/UX design guidance, Remotion video creation, document generation, multi-agent orchestration, context optimization, and social media publishing.

Build and optimize Next.js App Router applications with expert guidance on routing, API routes, Server Actions, authentication via Auth.js, and React Server Components. Includes CLI commands to add authentication, analyze performance, and scaffold components.

Build, deploy, and monitor Web3 dApps on Alchemy — from SDK setup and multi-chain client patterns to CI/CD, cost optimization, webhooks, and production readiness checks.

Use an autonomous AI agent to self-direct design annotation and UI critique workflows by adding a visual feedback toolbar to web pages and Next.js projects, syncing via MCP server.

Build, deploy, and monitor Flexport logistics integrations: manage shipments, purchase orders, webhooks, authentication, rate limits, and multi-environment deployments with TypeScript/Python patterns and CI/CD pipelines.

Automate the full lifecycle of Apify Actors: scaffold with Crawlee, deploy via CI/CD, monitor costs and performance, manage datasets and request queues, integrate with external apps via webhooks and API triggers, and safely upgrade SDKs.

Manage the full Algolia search lifecycle: configure indexes, sync data from databases, optimize performance and costs, handle errors and rate limits, enforce security and compliance, monitor with Prometheus/Grafana, and deploy to Vercel or Cloud Run.

Integrate, configure, and manage PostHog analytics across the full lifecycle — from SDK setup and event tracking to debugging, cost optimization, migration, and production deployment.

Initialize, develop, and migrate durable workflows with Vercel's Workflow SDK. Set up isolated dev sessions with branch-scoped URLs, install the SDK with auto-detected framework support, and port existing orchestrations from Temporal, Inngest, Trigger.dev, or AWS Step Functions.

Configure VSCode extensions to automate API testing with httpYac, monitor development server ports with Port Monitor, and deploy static websites via SFTP with Nginx templates.

Automate Figma design-to-code conversion using Anima SDK: generate React, Vue, or HTML components with Tailwind/TypeScript, set up CI/CD pipelines, debug SDK errors, optimize API costs, and secure credentials.

Build and deploy serverless applications and AI agents on EdgeOne Makers: cloud functions (Node.js, Python, Go), edge functions, middleware, KV/Blob storage, project scaffolding, and CLI management. Includes migration paths from LangChain, OpenAI Agents SDK, and other frameworks to the platform.

Build AI-powered chat interfaces in Next.js using pre-built React components for conversations, messages, tool displays, and prompt inputs, with AI Elements, shadcn/ui, and the AI SDK.

Orchestrates full-stack development workflows with specialized agents for code review, debugging, refactoring, testing, security auditing, and documentation across any software project.

Build and deploy full-stack TypeScript apps using NestJS, React, React Native, and Next.js with code generation for CRUD, monorepo management via Turborepo/Nx, AWS CDK infrastructure, Drizzle ORM patterns, security reviews, and automated testing—all from within Claude Code.

Bootstraps Android app development with Kotlin, Jetpack Compose, and MVVM architecture, while also providing a comprehensive multi-stack development environment with AI agent orchestration, TDD enforcement, code review, database guidance, and project management across mobile, web, and backend projects.

Enforces a PDCA (Plan-Do-Check-Act) quality gate workflow for AI-generated code, verifying implementation against design specs with automated agents, audit trails, and level-based trust controls. Includes fullstack project scaffolding, sprint management, Zero Script QA via structured logs, and deployment pipelines.

Plan and execute marketing campaigns from strategy to execution: SEO audits, content production, ad management (Google, Meta, TikTok, LinkedIn), social media posts, email marketing, and brand monitoring. Leverage Google Search Console data for SEO insights and optimize pages for search visibility and conversions.

Orchestrate parallel multi-agent workflows from plan files, execute headless browser automation, generate production-grade frontend code from design images, and manage Codex plugins, hooks, and custom agents.

Orchestrate multiple AI agents across Claude Code, Codex, Gemini, and other platforms to automate software development tasks including architecture, coding, review, testing, deployment, and documentation.

Manage feature flags and controlled rollouts in Next.js and SvelteKit using Vercel's Flags SDK, with support for multiple adapters and the Vercel Flags CLI.

Automates code refactoring and simplification across projects, removing dead/legacy code, reducing duplication, and enforcing framework-specific best practices for TypeScript, React/Next.js, Python, Go, and Swift while preserving functionality.

Add haptic feedback to buttons, toggles, forms, pickers, and other interactive elements in web apps, targeting mobile UIs with tactile interactions.

Apply best practices for React, Next.js, and React Native: enforce performance patterns, use View Transitions, and review UI code against accessibility and design guidelines for web and mobile apps.

Build and deploy full-stack apps on Butterbase BaaS: design schemas, configure auth and RLS, develop serverless functions and AI agents, deploy frontends, manage storage, and submit to hackathons.

Manage Firebase projects directly from Claude Code: deploy full-stack apps to Hosting and App Hosting, set up Firestore and Data Connect databases, configure Authentication and Remote Config, run Cloud Functions, integrate Gemini AI, audit security rules, and modify Xcode projects for iOS dependencies.

Build high-converting landing pages with Next.js and ShadCN UI, generate Instagram-style card news, automate web research and code analysis, track development changes, and enhance workflows with multi-AI engineering loops and design prompts.

Conduct design interviews to generate five UI variations matching your project's style, collect feedback, refine the best elements, and output implementation plans.

Manage entire project lifecycles from within Claude Code: save and resume session context, plan and track tasks, run security scans, generate documentation, deploy apps, and automate business workflows — all through markdown-based skills triggered by natural language commands.

Build, deploy, and manage web apps and AI agents on Vercel. Covers AI SDK integration, deployment pipelines, environment variables, caching, storage, authentication, and performance optimization across the Vercel platform.

Expert assistance for web development using React, Next.js, NestJS, TypeScript, and Tailwind CSS, covering code analysis, component creation, debugging, performance optimization, and architectural decisions.

Orchestrate AWS Amplify Gen 2 workflows to build full-stack web and mobile apps with authentication, data models, storage, GraphQL APIs, and Lambda functions, then deploy to sandbox or production using React, Next.js, Vue, Angular, React Native, Flutter, or Android.

Assembles a virtual design team of 26 specialist roles (UI, UX, brand, motion, data viz, email, social, accessibility, compliance, spatial, conversational, and more) inside the terminal. Generates production-ready UI code, Figma components, design tokens, accessibility audits, brand kits, email campaigns, social media content, data visualizations, presentations, and print artifacts from natural-language requests.

Auto-instrument any web app with Grafana Faro Web SDK for frontend observability. Detects your framework (React, Next.js, Angular, Vue, Svelte), generates initialization code, wires it into your entry point, and opens a PR.

Develop Ethereum dApps with AI assistance covering chain selection, gas estimation, L2s, DeFi protocols, smart contract security, testing, deployment, and UX best practices.

Implement drag-and-drop, scroll animations, gestures, SVG morphing, and layout transitions in React applications using Framer Motion, with optimized bundle sizes and spring physics support.

Inspect and manage Next.js projects locally with tools for debugging, performance analysis, and configuration management.

Configure i18n frameworks, replace hard-coded strings with translation keys, and audit locale parity, pluralization, and formatting across React, Next.js, and Vue codebases.

Develop Next.js 16 applications with App Router, Server Components, Server Actions, and Cache Components, covering async params, proxy.ts migration, and use cache errors for React 19.2 and SSR.

Manage Polar payment processor's local development environment with Docker (FastAPI, Next.js, PostgreSQL, Redis) and reference billing entities, Stripe integration, subscription lifecycle, and checkout flows.

Install and integrate 100+ animated Aceternity UI React components into Next.js projects using Tailwind CSS and shadcn CLI. Handles setup, registry configuration, and fixes integration errors for heroes, parallax, 3D effects, and animations.

Build full-stack React applications with TanStack Start, using file-based routing, server functions, and per-route SSR/CSR/SSG, with support for Cloudflare Workers and migration from Next.js

Adds zero-config animations to React components using @formkit/auto-animate, handling list transitions, accordions, toasts, and preventing SSR errors in Next.js and Vite.

Apply 57 React/Next.js performance rules from Vercel Engineering when writing, reviewing, or refactoring code to optimize waterfalls, bundles, server/client fetching, and re-renders.

Upload, transform, and serve images globally via Cloudflare Images API. Configure direct creator uploads, image variants, signed URLs, and WebP/AVIF optimization. Integrate with Workers, Next.js, and Remix. Diagnose upload errors and CORS issues.

Manage Sanity CMS content, schemas, and queries from Claude Code: design structured content models, write GROQ queries, generate TypeScript types, deploy schemas, migrate content from other CMSes, and implement Visual Editing, SEO, and A/B testing workflows.

Integrate Better Auth authentication into your project: set up auth config, database schema, and route handlers via interactive wizard; add plugins like 2FA, passkeys, and organizations; diagnose and fix authentication issues including OAuth callbacks and database bindings; explain error codes with solutions.

Enforces TDD with 80%+ coverage, runs multi-phase verification (build, lint, test, security), reviews code for security and quality issues, and manages learned instincts that evolve from session patterns into reusable skills, commands, and agents.

Automates browser-based QA for pull requests by detecting your frontend framework, indexing routes and test selectors, then running Playwright against acceptance criteria before you push.

Get expert assistance for web development with React, Next.js, and NestJS, including code analysis, component creation, debugging, performance optimization, and architectural decisions using TypeScript and Tailwind CSS.

Execute Uniswap swaps from React/Next.js frontends, Node.js backends, or directly on-chain, with built-in support for Permit2, wallet funding, and HTTP 402 machine-payable APIs.

Deploy Next.js apps to Cloudflare Workers using the OpenNext adapter, supporting SSR, ISR, App Router, and Pages Router while resolving worker size limits, runtime compatibility, and connection scoping issues.

Build provider-agnostic type-safe LLM chat applications with streaming, tools, agent loops, and multimodal inputs using OpenAI, Anthropic, Gemini, and Ollama in React, Solid, or Next.js frontends.