web-dev

Plugin web-dev in b-open-io/prompts. Commands read from the repo's manifest — today.

Skills (9)

• charting

  Data visualization and charting. Use for "create a chart", "visualize this data", "build a dashboard", "plot this", "graph these metrics", "make a bar chart", "build a heatmap", or help choosing a chart type, picking a charting library by data scale, or building the pipeline from raw database state

• chrome-cdp

  This skill should be used when the user asks to "inspect this page in Chrome", "debug what's happening in my browser", "read the browser console logs", "interact with the page open in Chrome", or "attach to my live Chrome session". Interacts with the user's local Chrome browser session via Chrome De

• create-next-project

  This skill should be used when the user asks to "create a new project", "scaffold a Next.js app", "initialize a new app", "start a new project", "set up a new Next.js project", or mentions "create-next-project". Provides a guided, opinionated full-stack Next.js project initialization with Biome, Tai

• frontend-performance

  This skill should be used when the user asks to "optimize my Next.js app", "why is this page slow", "reduce my bundle size", "improve Core Web Vitals", or "run a Lighthouse audit". Diagnoses and fixes Next.js frontend performance issues using Lighthouse, bundle analysis, and animation best practices

• generative-ui

  Decide between static components and AI-generated interfaces, and build the latter. Use for "generative UI", "dynamic UI", "json-render", "render JSON as UI", "AI UI generation", "MCP App UI", "deliver UI in chat", or "interactive chat interface". Covers the json-render framework, renderer and catal

• github-stars

  This skill should be used when adding GitHub star counts, star buttons, star widgets, or GitHub social proof to a website or app. Applies when the user says "add GitHub stars", "show star count", "add a star badge", "GitHub badge", "star widget", "GitHub social proof", "stargazer count", or wants to

• nextjs-upgrade

  Assess and upgrade a Next.js project after resolving the target release from current official documentation. Includes tested automation and breaking-change guidance for the Next.js 15 to 16 migration. Use when the user says 'upgrade Next.js', 'migrate to Next.js 16', 'update my Next.js app', 'run th

• perf-audit

  Run local performance audits on a project without network calls. This skill should be used when the user says 'audit performance', 'check bundle size', 'find large images', 'check for heavy dependencies', 'run a perf audit', 'how big is my bundle', 'optimize images', 'find oversized assets', or befo

• shadscan

  This skill should be used when the user asks to "audit my shadcn app", "run shadscan", "improve my shadscan score", "raise my shadscan grade", "fix accessibility/states/forms regressions in my shadcn components", or "add a shadscan CI gate". Drives the shadscan static analyzer (`npx @shadscan/cli`)

Subagents (4)

• designer

  UI and interface design agent. Use this agent when the user asks to "design a component", "create UI", "style a page", "set up shadcn", "implement dark mode", "review UI accessibility", "create a mockup", "design a game HUD", "build a TV app interface", or "add controller navigation". Covers design

• mobile

  Mobile development specialist. Expo and React Native are the house default, with Swift, Kotlin, and Flutter expertise. Use this agent when the user asks to "build an Expo app", "build a React Native screen", "add biometric login to my iOS app", "set up Flutter navigation", or "fix this Android perfo

• nextjs

  Next.js and React specialist following Vercel best practices with Bun and Biome. Use this agent when the user asks to "build a Next.js page", "fix this React 19 issue", "set up Turbopack", "migrate to async APIs", or "upgrade to Next.js 16". Not for React Native (use mobile) or visual component desi

• optimizer

  Performance specialist for profiling, bundle analysis, Core Web Vitals, and image optimization. Use this agent when the user asks to "fix our LCP", "reduce bundle size", "profile this bottleneck", "make animations less janky", "optimize these images", or "run a full performance audit" — especially w

Similar plugins