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
nexu-io
Frame Light Leak Cinema
Generates a single-frame HTML template with a cinematic film-leak aesthetic: warm light leaks, 35mm grain, 2.39:1 letterbox, and serif typography for opening titles or chapter cards.
· bundle
remotion-dev
Remotion Saas
Guides building video-generation SaaS apps with Remotion, covering framework selection, the Player component, and rendering options across Lambda, Vercel, Node.js, and Cloudflare.
3.9k · bundle
remotion-dev
Remotion Create
Scaffolds a new Remotion video project, guides React markup design with video layout rules, and starts the Remotion Studio preview server.
3.9k · bundle
remotion-dev
Remotion Markup
Guidance for writing Remotion React markup with animation patterns, media handling, sequences, effects, and advanced features like 3D, audio visualization, and parameterized videos.
3.9k · bundle
remotion-dev
Remotion Captions
Provides a Caption type definition and links to skills for transcribing, displaying, and importing captions in Remotion videos.
3.9k · bundle
remotion-dev
Remotion Interactivity
Provides best practices for creating Remotion animations that remain intuitive for AI agents and editable in Remotion Studio Visual Mode.
3.9k
zhaoxuya520
JS Reverse
Guides front-end JavaScript reverse engineering through a structured observe-capture-rebuild workflow using js-reverse MCP tools and optional jshookmcp for browser automation, CDP debugging, and runtime hooking.
12.8k · bundle
zhaoxuya520
Browser Automation
Unified automation entry point covering browser automation with Playwright and Windows desktop app automation with OpenReverse for GUI interaction, network capture, and reverse engineering workflows.
12.8k · bundle
zhaoxuya520
Competition OAUTH Oidc Chain
Maps and reproduces OAuth/OIDC authentication chains by tracing redirects, token exchange, and identity acceptance in controlled environments.
12.8k · bundle
autoclaw-cc
Xhs Explore
Search, browse, and analyze content on Xiaohongshu (Little Red Book) including feeds, note details, comments, and user profiles.
1.8k
xiaopu-ai
Web Design
Takes a PRD, reference URL, screenshot, or keywords to produce a DESIGN.md specification, then generates production-ready web code that meets UI/UX, visual, motion, and responsive standards.
635 · bundle
gsd-build
Gsd Browser
Automates browser interactions — navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, and running assertions — using a native Rust CLI.
256 · bundle
bzd6661
Wechat To Md
Converts WeChat Official Account articles into clean Markdown files with YAML frontmatter, locally downloaded images, and preserved code blocks.
92 · bundle
projectopensea
Opensea
Query NFT and token data, trade NFTs on Seaport, swap ERC20 tokens via DEX aggregator, configure wallet signing providers, and build/register/gate AI agent tools on Base.
47 · bundle
projectopensea
Opensea Tool Sdk
Build, register, and gate AI-callable tool endpoints using the OpenSea Tool Registry (ERC-8257) on Base, with NFT ownership, subscription, trait, or pay-per-call access control.
47 · bundle
maverickgao8848
Mav Slidecraft Skill
Create zero-dependency, animation-rich HTML presentations that run entirely in the browser, supporting new builds, PowerPoint conversion, or enhancements with strict viewport and design constraints.
45 · bundle
wangzan101
Zan HTML To Ppt
Converts HTML slide decks into offline PDF and image-based PPTX files using Playwright screenshots, preserving visual fidelity.
33 · bundle
claude-skills
Sveltekit Svelte5 Tailwind Skill
Guides building sites with SvelteKit 2, Svelte 5, and Tailwind CSS v4, covering setup, runes, forms, styling, deployment, and migration through curated documentation and a structured search workflow.
30 · bundle
kaguratart
Paper To Course
Converts academic papers into interactive HTML courses, Markdown documents, and PPTX presentations in a single run.
29 · bundle
majiayu000
Trpc
Build type-safe APIs with tRPC, covering procedures, routers, middleware, React integration, subscriptions, and error handling.
567 · bundle
majiayu000
Dit
Classifies HTML pages, forms, and fields using machine learning to detect page types, form types, and field types from HTML content or URLs.
567 · bundle
majiayu000
Juicebox V5
Build, deploy, and interact with Juicebox V5 projects, including revnets, hooks, and omnichain deployments, with API references, implementation details, UI generation, and GraphQL queries.
567 · bundle
majiayu000
Orval
Generates type-safe TypeScript clients from OpenAPI specs using Orval, covering configuration, React Query/SWR hooks, custom mutators, and MSW mocks.
567 · bundle
majiayu000
A11Y
Guides implementation of accessible web interfaces to meet WCAG 2.2 AA, WAI-ARIA 1.2, and WCAG2ICT standards, covering semantic HTML, ARIA patterns, focus management, and automated validation.
567 · bundle
majiayu000
A2ui
Generate A2UI 0.8 protocol compliant UI code for agent-driven interfaces, including JSONL messages for surface updates, data model updates, and rendering.
567 · bundle
majiayu000
Aica
Provides Kelvin Garr's fixed AICA brand identity and Next.js 14 implementation guide for building his personal sites and AICA-branded projects.
567 · bundle
ecnu-icalk
Webapp Testing
Tests local web applications by writing native Python Playwright scripts, with helpers for server lifecycle management, DOM inspection, and screenshot capture.
559 · bundle
ecnu-icalk
Baoyu Post To Wechat
Publishes articles and image-text posts to a WeChat Official Account via browser automation or API, converting markdown to HTML and validating metadata.
559 · bundle
ecnu-icalk
Baoyu Url To Markdown
Fetches any URL via Chrome CDP and converts HTML to clean markdown, supporting auto-capture and wait-for-user modes for login-required pages.
559 · bundle
ecnu-icalk
Jquery
Renders table cells with a red-to-green background gradient based on numeric values (0-100) using jQuery and chroma.js, skipping non-numeric content.
559
ecnu-icalk
Baoyu Markdown To HTML
Converts Markdown files to styled HTML with inline CSS, supporting themes, code highlighting, math, diagrams, footnotes, and alerts, optimized for WeChat and other platforms.
559 · bundle
agentskillexchange
HTML Docs
Turns folders, codebases, websites, PDFs, documents, and research topics into source-grounded HTML documents, narrated videos, or learning courses; publishes and revises collaborative HTML pages via CLI, REST API, and MCP server.
28
agentskillexchange
Crawl4ai MCP Server
Self-hosted web crawling and content extraction exposed as MCP tools, with depth control and clean markdown output.
28
agentskillexchange
Mdn Web Docs Fetcher
Fetches MDN Web Docs content via the Yari API and search index, including browser compatibility data, Web API references, and CSS property documentation, with offline lookups using the BCD npm package.
28
tinh2
UX
Audits UX quality of a codebase or validates implementation against design mockups, then fixes issues and commits changes.
13
tinh2
UI Craft
Polishes UI primitives one at a time using research-backed patterns: adds loading and icon states to buttons, replaces inline skeletons with primitives, adds secondary actions to errors, ensures 48px touch targets and visible focus indicators, and applies a standard motion token ladder.
13

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 remotion-markup, remotion-create, remotion-captions. 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.