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.
-
demerzels-lab Bundle Pencil To Code 2Export .pen design to React/Tailwind code.
10 - demerzels-lab Bundle Web Bundling 2
Bundle web applications into single HTML files for distribution.
10 - demerzels-lab Bundle Menuvision 2
Build beautiful HTML photo menus from restaurant URLs, PDFs, or photos using Gemini Vision and AI image generation.
10 - demerzels-lab Bundle Axe Devtools 2
Accessibility testing and remediation using the axe MCP Server.
10 - demerzels-lab Bundle Skill 2 2
Convert Markdown text to beautifully styled, self-contained HTML with embedded CSS.
10 - demerzels-lab Bundle Stack Scaffold 2
Scaffolds a full-stack project with Next.js App Router, Supabase, Firebase Auth, Vercel, and Cloudflare.
10 - demerzels-lab Bundle Query Dbpedia 2
Transform natural language questions into SPARQL queries for DBpedia and generate beautiful HTML results pages.
10 - demerzels-lab Bundle Agent Browser 4
Headless browser automation CLI optimized for AI agents with accessibility tree snapshots.
10 - demerzels-lab Bundle Html2md 2
Convert HTML pages to clean, agent-friendly markdown using Readability + Turndown.
10 - demerzels-lab Bundle Next Upgrade 2
Upgrade Next.js to the latest version following official migration guides and codemods.
10 - demerzels-lab Bundle Baidu Baike Data 2
The Baidu Baike Component is a knowledge service tool designed to query authoritative encyclopedia explanations.
10 - demerzels-lab Bundle Anti Slop Design 2
Create distinctive, production-grade frontend interfaces that avoid generic AI aesthetics.
10 - demerzels-lab Bundle Myvibe Skills 2
Publish static HTML, ZIP archive, or directory to MyVibe.
10 - demerzels-lab Bundle Voice Email 2
Send emails via natural voice commands - designed for accessibility.
10 - demerzels-lab Bundle Dynamic UI 2
Render tables, charts, stats, cards, and dashboards as images using HTML templates and wkhtmltoimage.
10 - demerzels-lab Bundle Finally Offline 2
Browse culture articles and generate personalized HTML newsletters via MCP.
10 - demerzels-lab Bundle Aliyun Mail 2
A skill to send emails via Aliyun enterprise email service with support for markdown, HTML text, attachments.
10 - demerzels-lab Bundle Query Wikidata 2
Transform natural language questions into SPARQL queries for Wikidata and generate beautiful HTML results pages.
10 - demerzels-lab Bundle Web Design Pro 2
Modern web design engineering skills including design tokens, advanced UI/UX methodologies, accessibility.
10 - demerzels-lab Bundle Shadcn Theme Default 2
Enforces the default shadcn/ui Neutral theme (black/white/gray) with OKLCH CSS variables, Tailwind v4 integration.
10 - demerzels-lab Bundle Lb Motion Skill 2
Complete Motion.dev documentation - modern animation library for React, JavaScript, and Vue (formerly Framer Motion)
10 - demerzels-lab Bundle Devbridge Frontend 2
Frontend Bridge Agent
10 - demerzels-lab Bundle Cancorteaw App 2
Local **Expo / React Native** app builder runner for my OpenClaw server.
10 - demerzels-lab Bundle Firebase Auth Setup 2
Configures Firebase Authentication — providers, security rules, custom claims, and React auth hooks.
10 - demerzels-lab Bundle Baidu Baike Search 2
The Baidu Baike Component is a knowledge service tool designed to query authoritative encyclopedia explanations.
10 - demerzels-lab Bundle Animation Gen 2
Generate CSS and Framer Motion animations from plain English. Use when you need smooth animations without the math.
10 - demerzels-lab Bundle Component Gen 2
Generate React components from plain English descriptions. Use when you need UI components fast.
10 - demerzels-lab Bundle Generate Presentation 2
Generate professional HTML and PDF presentations from markdown content, URLs, or topics.
10 - demerzels-lab Bundle Materials Workbench 2
Materials editor workbench — React UI and Express server to render JSON schemas to images and generate schemas.
10 - demerzels-lab Bundle Copilotkit React 2
CopilotKit React best practices for agentic applications.
10 - demerzels-lab Bundle Gedcom Explorer 2
Generate an interactive family tree dashboard from any GEDCOM (.ged) file. Creates a single-file HTML app with 5 tabs (Dashboard, Family Tree, People, Timeline, Daily Alerts), search, person modals, charts, and "On This Day" events. Use when asked to visualize genealogy data, explore family history, build a family tree viewer, or work with GEDCOM files. Triggers on "family tree", "genealogy", "GEDCOM", "ancestors", "family explorer", "family history dashboard".
10 - demerzels-lab Bundle Custom Smtp Sender 2
A skill to send emails with support for markdown, HTML.
10 - demerzels-lab Bundle Sparkle Vpn 2
Control Sparkle VPN - start and stop VPN connections using Mihomo core directly.
10 - demerzels-lab Bundle Unipile Linkedin 2
Interact with LinkedIn via Unipile API - send messages, view profiles, manage connections, create posts, react.
10 - demerzels-lab Bundle Screenshot Skill 2
Capture screenshots on Windows using mss and Pillow.
10 - demerzels-lab Bundle Next Best Practices 2
Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling.
10
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 pencil-to-code, web-bundling, menuvision. 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.