Web & Frontend Agent Skills
Web development agent skills handle frontend and full-stack work: component patterns, CSS and accessibility fixes, performance budgets, and framework conventions. Install a skill once and your AI agent follows the same playbook in every project, from quick prototypes to production apps.
Web & Frontend
1,641 skills
leandrobenjaminl Frontend React Development
Crea componentes React escalables con TypeScript, hooks y patrones de composición, cubriendo estados de carga, vacío, error y éxito, y decidiendo entre Server y Client Components.
0
leandrobenjaminl Frontend Responsive Design
Implementa diseño responsive moderno con técnicas mobile-first, Container Queries, Grid, Flexbox y clamp() para adaptar layouts y componentes a cualquier pantalla o contenedor.
0
drnabeelkhan Maxim UI Styling
Builds accessible, responsive UI components and layouts with shadcn/ui, Tailwind CSS, theming, dark mode, and WCAG 2.1 AA compliance, applying behavioral science principles.
2 · bundle
nimoqup046-collab Shadcn
Manages shadcn/ui components and projects, providing context, documentation, and usage patterns for building modern design systems.
2 · bundle
nimoqup046-collab Defuddle
Extracts clean markdown content from web pages using the Defuddle CLI, removing clutter and navigation to save tokens. Prefer over WebFetch for reading or analyzing standard web pages.
2
nimoqup046-collab Fp React
Practical patterns for using fp-ts with React: Option for optional state, Either for form validation, TaskEither for data fetching, and RemoteData for async state management.
2
nimoqup046-collab Sveltekit
Build full-stack web applications with SvelteKit, covering file-based routing, SSR, SSG, API routes, and form actions.
2
sakamoto-family-smile SEO
Audits and improves search visibility through technical SEO, on-page optimization, structured data, Core Web Vitals, and content strategy.
0
sakamoto-family-smile UI Demo
Records polished UI demo videos of web applications using Playwright, with an injected cursor overlay, natural pacing, and a discover-rehearse-record workflow.
0
sakamoto-family-smile Motion UI
Implements accessible, performant animations and transitions in React/Next.js apps using Motion, with tokens, reduced-motion support, and device adaptation.
0
sakamoto-family-smile UI To Vue
Batch-converts UI design screenshots into Vue 3 Composition API components using Vant, Element Plus, or Ant Design Vue, with router wiring and shared component extraction.
0
sakamoto-family-smile React Patterns
Provides idiomatic React 18/19 patterns for hooks, server/client components, Suspense, error boundaries, forms, data fetching, state management, and accessibility-first composition.
0
sakamoto-family-smile Angular Developer
Generates Angular code and provides architectural guidance for projects, components, services, reactivity, forms, dependency injection, routing, accessibility, animations, styling, testing, and CLI tooling.
0 · bundle
sakamoto-family-smile Frontend Patterns
Provides React and Next.js patterns for component composition, state management, data fetching, and performance optimization.
0
sakamoto-family-smile React Performance
Optimizes React and Next.js performance with 70+ rules across 8 priority categories, covering waterfalls, bundle size, server-side, client fetching, re-renders, rendering, JS micro-perf, and advanced patterns. Use when writing, reviewing, or refactoring React/Next.js code.
0
lord1egypt Sketch
Generates 2-3 disposable HTML mockups for comparing UI design directions before committing to one.
2
lord1egypt Pretext
Builds creative browser demos with @chenglou/pretext for DOM-free text layout, enabling ASCII art, typographic flow around obstacles, text-as-geometry games, kinetic typography, and text-powered generative art. Produces single-file HTML demos by default.
2
lord1egypt Claude Design
Guides CLI/API agents through a design process for one-off HTML artifacts like landing pages, prototypes, and decks, emphasizing context gathering and verification.
2
lord1egypt Hum
Publishes long-form articles to hum.pub, handling registration, authentication, SEO metadata, and audience engagement for AI authors.
2
kbarbel640-del Browse
Create and deploy browser automation functions with the Stagehand CLI, from interactive site exploration to production deployment.
1 · bundle
kbarbel640-del Ip Lookup
Retrieves the current public IP address and geolocation details using curl-based web services, with fallback options and clear display formatting.
1 · bundle
kbarbel640-del Web Search
Searches the web for text, news, images, videos, and books using the duckse CLI, returning clean results in text or JSON format.
1 · bundle
kbarbel640-del Raycast Extensions
Build and maintain Raycast extensions using the Raycast API, covering UI components, data persistence, feedback, and restricted APIs like AI and Browser Extension.
1 · bundle
pwdev-solucoes Reka UI
Compose custom Vue components with Reka UI v2 headless primitives, covering asChild/as composition, controlled state, portals, and Radix Vue migration.
2
pwdev-solucoes Shadcn Vue
Scaffold, install, and compose shadcn-vue components built on Reka UI v2, including Vue variants, form patterns with vee-validate/Zod, and adaptation of existing components.
2
sdiamante13 Agent Browser
Automates browser interactions for web testing, form filling, screenshots, and data extraction.
7 · bundle
sdiamante13 Exploratory Testing
Performs comprehensive exploratory testing on a website using browser automation, covering user journeys, forms, errors, accessibility, responsiveness, performance, and security basics.
7
sdiamante13 Remotion Best Practices
Loads Remotion best practices for React video creation, covering animations, composition setup, assets, audio, captions, sequencing, transitions, media metadata, Three.js, Tailwind, and rendering patterns.
7 · bundle
scoheart Tavily CLI
Performs web search, content extraction, site crawling, URL discovery, and deep research via the Tavily CLI, returning JSON for LLM consumption.
2
scoheart Tavily Map
Discovers and lists all URLs on a website without extracting content, using the Tavily CLI. Faster than crawling, with options for depth, filtering, and natural language instructions.
2
scoheart Tavily Crawl
Crawls websites and saves content from multiple pages as local markdown files using the Tavily CLI, with options for depth, breadth, path filtering, and semantic focus.
2
scoheart Tavily Extract
Extracts clean markdown or text from one or more URLs using the Tavily CLI, with support for JavaScript-rendered pages and query-focused chunking.
2
scoheart Firecrawl Map
Discovers and lists all URLs on a website, with optional search filtering to find specific pages within large sites.
2
scoheart Firecrawl Crawl
Bulk extract content from an entire website or site section by crawling pages that follow links, with configurable depth, path filters, and concurrency.
2
scoheart Firecrawl Download
Saves an entire website as local files by mapping pages and scraping each into organized directories, supporting multiple formats and screenshots.
2
scoheart Firecrawl Interact
Controls a live browser session on scraped pages to click, fill forms, navigate flows, and extract data using natural language prompts or code, including support for authenticated sessions via profiles.
2
Frequently asked questions
What are Web & Frontend agent skills?
Web development agent skills handle frontend and full-stack work: component patterns, CSS and accessibility fixes, performance budgets, and framework conventions. Install a skill once and your AI agent follows the same playbook in every project, from quick prototypes to production apps.
Which Web & Frontend skills are most installed?
Popular Web & Frontend skills on SkillMD right now include browse, ip-lookup, web-search. Rankings shift as installs change; sort this page by "Most downloaded" for the live list.
Do Web & Frontend skills work with Claude Code and Cursor?
Yes. Every skill here ships as a SKILL.md file, an open format that works in Claude Code, Claude.ai, Cursor, Codex, Windsurf, and 60+ other agents. Install one with npx skillmds add <owner>/<name>, or copy the file into your agent's skills directory.