Web & Frontend
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.
-
modbender Skill HTML To PptConvert HTML/Markdown to PowerPoint presentations using Marp
12 -
modbender Bundle Jina ReaderWeb content extraction via Jina AI Reader API. Three modes: read (URL to markdown), search (web search + full content), ground (fact-checking). Extracts clean content without exposing server IP.
12 -
modbender Bundle Lh Edge TtsText-to-speech conversion using Python edge-tts for generating audio from text. Supports multiple voices, languages, speed adjustment, pitch control, and subtitle generation. Use when: (1) User requests audio/voice output with the "tts" trigger or keyword. (2) Content needs to be spoken rather than read (multitasking, accessibility, driving, cooking). (3) User wants a specific voice, speed, pitch, or format for TTS output.
12 -
modbender Bundle Mail ClientIMAP/SMTP mail client for OpenClaw agents. Use when: (1) reading or listing emails from a mailbox, (2) searching emails by sender, subject, date or text, (3) sending emails with plain text or HTML body, with optional file attachments, (4) moving, marking, or deleting messages. NOT for: bulk mailing, newsletters, calendar/contacts (use CalDAV), or providers requiring OAuth (use a dedicated skill).
12 -
modbender Bundle MoneydevkitAccept payments on any website using moneydevkit. Use when building a site that sells something, adding a checkout/paywall, or integrating payments into a Next.js or Replit app. Supports fixed pricing, pay-what-you-want, products, customers, and orders. Bitcoin Lightning under the hood — works globally, no bank account needed.
12 -
modbender Bundle Read GithubRead GitHub repos the RIGHT way - via gitmcp.io instead of raw scraping. Why this beats web search: (1) Semantic search across docs, not just keyword matching, (2) Smart code navigation with accurate file structure - zero hallucinations on repo layout, (3) Proper markdown output optimized for LLMs, not raw HTML/JSON garbage, (4) Aggregates README + /docs + code in one clean interface, (5) Respects rate limits and robots.txt. Stop pasting raw GitHub URLs - use this instead.
12 -
modbender Bundle Rednote MacControl the RedNote (Xiaohongshu) Mac app via macOS Accessibility API. Fills the gap headless tools can't: read/reply to comments on video posts, send DMs, get author stats. No browser, no API tokens. macOS only — requires Terminal accessibility permission.
12 -
modbender Bundle Smart FetchFetch web pages for LLM use with markdown-first negotiation, strict output limits, cache/revalidation, and robust HTML fallback. Use for article/doc/blog scraping where token efficiency, safer ingestion, and predictable extraction behavior are important.
12 -
modbender Bundle Smtp SenderA skill to send emails with support for markdown, HTML text, and attachments, leveraging existing SMTP configuration in `{skill~}/smtp-config.json`. Includes retry logic and logging.
12 -
modbender Skill Tailwind CSSWrite Tailwind utility classes with proper responsive design, dark mode, and configuration.
12 -
modbender Bundle React ExpertUse when building React 18+ applications requiring component architecture, hooks patterns, or state management. Invoke for Server Components, performance optimization, Suspense boundaries, React 19 features.
12 -
modbender Skill React NativeBuild performant cross-platform mobile apps with React Native components, navigation, and native modules.
12 -
modbender Bundle Refund RadarScan bank statements to detect recurring charges, flag suspicious transactions, and draft refund requests with interactive HTML reports.
12 -
modbender Bundle Resend EmailSend emails via Resend API from any verified domain. Use when sending emails, notifications, or automated messages. Supports HTML and plain text. Default voice is warm bureaucratic (configurable).
12 -
modbender Skill Solana DevEnd-to-end Solana development playbook (Jan 2026). Prefer Solana Foundation framework-kit (@solana/client + @solana/react-hooks) for React/Next.js UI. Prefer @solana/kit for all new client/RPC/transaction code. When legacy dependencies require web3.js, isolate it behind @solana/web3-compat (or @solana/web3.js as a true legacy fallback). Covers wallet-standard-first connection (incl. ConnectorKit), Anchor/Pinocchio programs, Codama-based client generation, LiteSVM/Mollusk/Surfpool testing, and security checklists.
12 -
modbender Bundle Audit WebsiteAudit websites for SEO, performance, security, technical, content, and 15 other issue cateories with 230+ rules using the squirrelscan CLI. Returns LLM-optimized reports with health scores, broken links, meta tag analysis, and actionable recommendations. Use to discover and asses website or webapp issues and health.
12 -
modbender Bundle UI UX MasterMaster UI/UX design skill combining Apple HIG, modern web design, SuperDesign patterns, and universal design principles. Use for any UI/UX design task including iOS/macOS/web apps, landing pages, dashboards, design systems, accessibility, responsive layouts, animation, and creating beautiful, functional interfaces across all platforms and frameworks.
12 -
modbender Bundle UX DecisionsAI skill for the Making UX Decisions framework (uxdecisions.com) by Tommy Geoco. Use for UI/UX design decisions, design audits, pattern selection, visual hierarchy analysis, and reviewing designs for completeness. Enables rapid, intentional interface design with checklists for visual style, accessibility, social proof, navigation, and more.
12 -
modbender Skill Web BundlingBundle web applications into single HTML files for distribution. Use when creating self-contained HTML games, artifacts, or demos that need to be shared as a single file. Covers React+Vite+Parcel bundling pattern.
12 -
modbender Skill Wp To StaticConvert a WordPress website to a static site and deploy to Cloudflare Pages. Mirrors the rendered HTML via SSH, extracts only referenced assets (shrinks 1.5GB+ to ~25MB), fixes URLs, self-hosts fonts, strips WordPress cruft, and deploys. Use when migrating a WordPress site to static hosting.
12 -
modbender Bundle AccessibilityBuild WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text), keyboard navigation, form labels, and live regions. Use when implementing accessible interfaces, fixing screen reader issues, keyboard navigation, or troubleshooting "focus outline missing", "aria-label required", "insufficient contrast".
12 -
modbender Bundle Airbnb SearchSearch Airbnb listings with prices, ratings, and direct links. No user API key required (uses Airbnb's public frontend API key). Use when searching for Airbnb stays, vacation rentals, or accommodation pricing.
12 -
modbender Skill Dev Pro Next FastapiA high-tier coding assistant specializing in Next.js (React) and FastAPI (Python) architecture, security, and performance.
12 -
modbender Skill Fastfish Litefastfish 开源精简版。提供公众号格式整理、敏感词检测(本地)、每日热点、本地 HTML 预览。热点推送需至少配置一个渠道的 env。无微信发布/授权,需商业版。通过 system.run 调用 CLI。
12 -
modbender Bundle IOS SimulatorAutomate iOS Simulator workflows (simctl + idb): create/boot/erase devices, install/launch apps, push notifications, privacy grants, screenshots, and accessibility-based UI navigation. Use when working with iOS apps, Xcode, Simulator, simctl, idb, UI automation, or iOS testing.
12 -
modbender Bundle Legal Docs FrGénérateur de documents juridiques français pour freelances/micro-entrepreneurs. Génère des CGV, mentions légales, contrats de prestation et devis en HTML.
12 -
modbender Bundle Myvibe PublishPublish static HTML, ZIP archive, or directory to MyVibe. Use this skill when user wants to publish web content to MyVibe.
12 -
modbender Skill Nextjs ExpertUse when building Next.js 14/15 applications with the App Router. Invoke for routing, layouts, Server Components, Client Components, Server Actions, Route Handlers, authentication, middleware, data fetching, caching, revalidation, streaming, Suspense, loading states, error boundaries, dynamic routes, parallel routes, intercepting routes, or any Next.js architecture question.
12 -
modbender Bundle PDF GeneratorGenerate professional PDFs from Markdown, HTML, data, or code. Reports, invoices, contracts, and documents with best practices.
12 -
modbender Bundle Dbpedia Query SkillTransform natural language questions into SPARQL queries for DBpedia and generate beautiful HTML results pages. Query the DBpedia knowledge graph using plain English prompts.
12 -
modbender Bundle Steel BrowserControl cloud browser sessions via Steel.dev for web automation and computer-use agents. Use when you need to browse the web, fill forms, click elements, take screenshots, scrape content, or build browser automation loops. Uses Playwright selectors (CSS/text/aria) instead of pixel coordinates — more reliable than e2b-desktop for pure web tasks. Supports residential proxies and CAPTCHA solving.
12 -
modbender Bundle Vue Expert JSUse when building Vue 3 applications with JavaScript only (no TypeScript). Invoke for JSDoc typing, vanilla JS composables, .mjs modules.
12 -
modbender Bundle Warren DeployDeploy websites and files permanently on MegaETH blockchain. AI agents stress test the network by deploying HTML on-chain using SSTORE2 bytecode storage. Agents pay their own gas.
12 -
modbender Skill Wp Multitool Wordpress Optimization ToolkitWordPress site health audit, performance optimization, database cleanup, autoload tuning, slow query detection, wp-config management, image size control, frontend speed fixes, and server diagnostics. Combines 14 optimization and control modules into a single plugin, replacing a stack of single-purpose tools. Open-source on GitHub. Installs on any WordPress 5.8+ site.
12 -
modbender Bundle Cancorteaw AppLocal Expo / React Native app builder runner for my OpenClaw server.
12 -
modbender Bundle Code2animationEnd-to-end video production skill using the code2animation framework (https://github.com/etrobot/code2animation). Use this skill whenever the user wants to produce a code animation video, tech explainer video, or any animated video using code2animation — including writing the script, generating TTS audio, creating HTML/React visual assets, and rendering the final MP4. Trigger on any of: "make a video", "create an animation", "generate a code animation", "produce a tech video", "write a code2animation script", "render a video with code2animation", or any request that involves scripting + TTS + rendering in this stack. Always use this skill for the full pipeline, not just individual steps.
12
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 html-to-ppt, jina-reader, lh-edge-tts. Rankings shift as installs change; sort this page by "Most installs" 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@latest add <owner>/<name>, or copy the file into your agent's skills directory.