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.
-
diegosouzapw Bundle Frontend Slides V2 2Frontend Slides workflow skill. Use this skill when the user needs Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Remotion Best Practices 2
remotion-best-practices workflow skill. Use this skill when the user needs Best practices for Remotion - Video creation in React and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Mobile Developer V3 2
mobile-developer workflow skill. Use this skill when the user needs Develop React Native, Flutter, or native mobile apps with modern architecture patterns. Masters cross-platform development, native integrations, offline sync, and app store optimization and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Angular State Management 3
Angular State Management workflow skill. Use this skill when the user needs Master modern Angular state management with Signals, NgRx, and RxJS. Use when setting up global state, managing component stores, choosing between state solutions, or migrating from legacy patterns and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle 3d Web Experience V3 2
3D Web Experience workflow skill. Use this skill when the user needs Expert in building 3D experiences for the web - Three.js, React and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Tailwind Patterns V3 2
Tailwind CSS Patterns (v4 - 2025) workflow skill. Use this skill when the user needs Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend Developer V2 2
frontend-developer workflow skill. Use this skill when the user needs Build React components, implement responsive layouts, and handle client-side state management. Masters React 19, Next.js 15, and modern frontend architecture and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend Developer V3 2
frontend-developer workflow skill. Use this skill when the user needs Build React components, implement responsive layouts, and handle client-side state management. Masters React 19, Next.js 15, and modern frontend architecture and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle React Flow Node TS 2
React Flow Node workflow skill. Use this skill when the user needs Create React Flow node components following established patterns with proper TypeScript types and store integration and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Unity Ecs Patterns 2
Unity ECS Patterns workflow skill. Use this skill when the user needs Production patterns for Unity's Data-Oriented Technology Stack (DOTS) including Entity Component System, Job System, and Burst Compiler and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Fp TS React V2 2
Functional Programming in React workflow skill. Use this skill when the user needs Practical patterns for using fp-ts with React - hooks, state, forms, data fetching. Use when building React apps with functional programming patterns. Works with React 18/19, Next.js 14/15 and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Angular UI Patterns 3
Angular UI Patterns workflow skill. Use this skill when the user needs Modern Angular UI patterns for loading states, error handling, and data display. Use when building UI components, handling async data, or managing component states and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend UI Dark TS 2
Frontend UI Dark Theme (TypeScript) workflow skill. Use this skill when the user needs A modern dark-themed React UI system using Tailwind CSS and Framer Motion. Designed for dashboards, admin panels, and data-rich applications with glassmorphism effects and tasteful animations and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle React Modernization 2
React Modernization workflow skill. Use this skill when the user needs Master React version upgrades, class to hooks migration, concurrent features adoption, and codemods for automated transformation and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle C4 Component V2 2
C4 Component Level: [Component Name] workflow skill. Use this skill when the user needs Expert C4 Component-level documentation specialist. Synthesizes C4 Code-level documentation into Component-level architecture, defining component boundaries, interfaces, and relationships and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Xss HTML Injection V2 2
Cross-Site Scripting and HTML Injection Testing workflow skill. Use this skill when the user needs Execute comprehensive client-side injection vulnerability assessments on web applications to identify XSS and HTML injection flaws, demonstrate exploitation techniques for session hijacking and credential theft, and validate input sanitization and output encoding mechanisms and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Nextjs App Router Patterns 2
Next.js App Router Patterns workflow skill. Use this skill when the user needs Comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Expo Tailwind Setup V2 2
Tailwind CSS Setup for Expo with react-native-css workflow skill. Use this skill when the user needs Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Expo Tailwind Setup V3 2
Tailwind CSS Setup for Expo with react-native-css workflow skill. Use this skill when the user needs Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend UI Dark TS V2 2
Frontend UI Dark Theme (TypeScript) workflow skill. Use this skill when the user needs A modern dark-themed React UI system using Tailwind CSS and Framer Motion. Designed for dashboards, admin panels, and data-rich applications with glassmorphism effects and tasteful animations and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Fixing Accessibility V2 2
fixing-accessibility workflow skill. Use this skill when the user needs Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, focus management, color contrast, and form errors. Use when adding interactive controls, forms, dialogs, or reviewing WCAG compliance and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend Mobile Security Xss Scan V2 2
XSS Vulnerability Scanner for Frontend Code workflow skill. Use this skill when the user needs You are a frontend security specialist focusing on Cross-Site Scripting (XSS) vulnerability detection and prevention. Analyze React, Vue, Angular, and vanilla JavaScript code to identify injection poi and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Javascript Typescript Typescript Scaffold 3
TypeScript Project Scaffolding workflow skill. Use this skill when the user needs You are a TypeScript project architecture expert specializing in scaffolding production-ready Node.js and frontend applications. Generate complete project structures with modern tooling (pnpm, Vite, N and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Accessibility Compliance Accessibility Audit 3
Accessibility Audit and Testing workflow skill. Use this skill when the user needs You are an accessibility expert specializing in WCAG compliance, inclusive design, and assistive technology compatibility. Conduct audits, identify barriers, and provide remediation guidance and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend Mobile Development Component Scaffold 3
React/React Native Component Scaffolding workflow skill. Use this skill when the user needs You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, s and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Application Performance Performance Optimization 3
application-performance-performance-optimization workflow skill. Use this skill when the user needs Optimize end-to-end application performance with profiling, observability, and backend/frontend tuning. Use when coordinating performance optimization across the stack and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Frontend Mobile Development Component Scaffold V2 2
React/React Native Component Scaffolding workflow skill. Use this skill when the user needs You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, s and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 - diegosouzapw Bundle Application Performance Performance Optimization V2 2
application-performance-performance-optimization workflow skill. Use this skill when the user needs Optimize end-to-end application performance with profiling, observability, and backend/frontend tuning. Use when coordinating performance optimization across the stack and the operator should preserve the upstream workflow, copied support files, and provenance before merging or handing off.
54 -
humaisali Bundle Survey GeneratorGenerate source-backed AI/ML survey paper artifacts with curated bibliographies and Fireworks/Kimi HTML rendering.
- humaisali Skill 3d Web Experience
Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing depth to web experiences.
- humaisali Skill Angular Migration
Master AngularJS to Angular migration, including hybrid apps, component conversion, dependency injection changes, and routing migration.
- humaisali Bundle Design Philosophy
Visual philosophy and art-direction for frontend. Use when creating high-concept work, campaigns, or when the user asks for a visual philosophy, manifesto, or unmistakable art-like aesthetic.
- humaisali Skill Markstream Svelte
Integrate the beta markstream-svelte renderer into Svelte 5 or SvelteKit with runes, explicit CSS, smooth streaming, workers, and SSR-safe boundaries.
- humaisali Skill Tailwind Patterns
Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.
- humaisali Skill Vibe Code Cleanup
Safe production cleanup and hardening for vibe-coded fullstack apps (Next.js, React, Node.js, etc.). Removes dead imports, unused files, and broken references without breaking routes or APIs.
- humaisali Skill Vercel Deployment
Expert knowledge for deploying to Vercel with Next.js
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 frontend-slides-v2, remotion-best-practices, mobile-developer-v3. 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.