THE COLLECTION / AI for Web Development
Methods for AI for Web Development.
Explore the methods in this collection, see what each skill covers and choose where to start.
WHAT IS INSIDE
The methods.
One by one.
Open a skill to see what it covers. Its individual page explains the method and the available download formats.
A pack is a collection of skills. A practice example helps you apply a method; it does not replace the skills themselves. Some tasks require external tools, access and your review.
79 skills in this collection
a11y-auditAuditar accesibilidad WCAG 2.1/2.2 de websites de clientes: contraste de color, navegación por teclado, screen reader, ARIA labels, focus visible, landmarks, formularios accesibles. Triggers: auditar accesibilidad, wcag, accessibility audit, accesibilidad web, a11y, keyboard navigation, screen reader test.
A method included in the original pack
skills/transversal/a11y-audit/SKILL.md
Read the skill and download optionsa11y-debuggingAccessibility Tree vs DOM: Visually hiding an element (e.g., CSS opacity: 0) behaves differently for screen readers than display: none or aria-hidden='true'. The takesnapshot tool returns the accessibility tree of the page, which…
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/chrome-devtools-mcp/skills/a11y-debugging/SKILL.md
Read the skill and download optionsads-troubleshooterDiagnose and fix common advertising campaign performance issues. Use when: (1) Troubleshooting low ad performance, (2) Diagnosing high CPA/CPC issues, (3) Fixing low conversion rates, (4) Investigating ad delivery issues, (5) Optimizing underperforming campaigns.
A method included in the original pack
skills/transversal/ads-troubleshooter/SKILL.md
Read the skill and download optionsapi-and-interface-designGuides stable API and interface design. Use when designing APIs, module boundaries, or any public interface. Use when creating REST or GraphQL endpoints, defining type contracts between modules, or establishing boundaries between frontend and backend.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/api-and-interface-design/SKILL.md
Read the skill and download optionsapi-designContract-first design, Hyrum's Law, One-Version Rule, error semantics, boundary validation. APIs are promises — design them carefully because changing them is expensive.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/api-design/SKILL.md
Read the skill and download optionsapi-integration-architectDesign and implement API integrations between marketing platforms and tools. Use when: (1) Planning API integrations, (2) Troubleshooting API issues, (3) Designing webhook workflows, (4) Setting up OAuth authentication, (5) Optimizing API performance and rate limits.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/api-integration-architect/SKILL.md
Read the skill and download optionsastro-buildFramework web para crear sitios rápidos con arquitectura Islands. Zero JS por defecto, soporte para React/Vue/Svelte/Solid, optimizado para contenido. Ideal para landing pages, blogs, e-commerce, y sitios de marketing.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/astro-build/SKILL.md
Read the skill and download optionsasync-python-patternsDomina asyncio de Python: concurrent programming, async/await, event loops y high-performance applications.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/async-python-patterns/SKILL.md
Read the skill and download optionsbrowser-testing-devtoolsDebugging en browser: Chrome DevTools para runtime data, DOM inspection, network analysis y performance profiling.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/browser-testing-devtools/SKILL.md
Read the skill and download optionsbrowser-testing-with-devtoolsTests in real browsers. Use when building or debugging anything that runs in a browser. Use when you need to inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output with real runtime data via Chrome DevTools MCP.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/browser-testing-with-devtools/SKILL.md
Read the skill and download optionschrome-devtoolsBrowser lifecycle: Browser starts automatically on first tool call using a persistent Chrome profile. Configure via CLI args in the MCP server configuration: npx chrome-devtools-mcp@latest --help.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/chrome-devtools-mcp/skills/chrome-devtools/SKILL.md
Read the skill and download optionschrome-devtools-cliThe chrome-devtools-mcp CLI lets you interact with the browser from your terminal.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/chrome-devtools-mcp/skills/chrome-devtools-cli/SKILL.md
Read the skill and download optionsci-cd-and-automationAutomates CI/CD pipeline setup. Use when setting up or modifying build and deployment pipelines. Use when you need to automate quality gates, configure test runners in CI, or establish deployment strategies.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/ci-cd-and-automation/SKILL.md
Read the skill and download optionsci-cd-automationAutomatiza pipelines de build y deploy: tests, linting, build steps y deployments. Integracion con GitHub Actions.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/ci-cd-automation/SKILL.md
Read the skill and download optionsCMS DeveloperDrupal and WordPress specialist for theme development, custom plugins/modules, content architecture, and code-first CMS implementation
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/engineering-cms-developer/SKILL.md
Read the skill and download optionscode-review-and-qualityConducts multi-axis code review. Use before merging any change. Use when reviewing code written by yourself, another agent, or a human. Use when you need to assess code quality across multiple dimensions before it enters the main branch.
A method included in the original pack
skills/verticals/web-development/skills/code-review-and-quality/SKILL.md
Read the skill and download optionscode-simplificationSimplifies code for clarity. Use when refactoring code for clarity without changing behavior. Use when code works but is harder to read, maintain, or extend than it should be. Use when reviewing code that has accumulated unnecessary complexity.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/code-simplification/SKILL.md
Read the skill and download optionsCode ReviewerExpert code reviewer who provides constructive, actionable feedback focused on correctness, maintainability, security, and performance — not style preferences.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/engineering-code-reviewer/SKILL.md
Read the skill and download optionscontext-engineeringOptimizes agent context setup. Use when starting a new session, when agent output quality degrades, when switching between tasks, or when you need to configure rules files and context for a project.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/context-engineering/SKILL.md
Read the skill and download optionscore-web-vitals-auditorAudit Core Web Vitals (LCP, CLS, INP) performance. Diagnose issues, prioritize fixes, and track improvements over time.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/core-web-vitals-auditor/SKILL.md
Read the skill and download optionsdatabase-query-builderBuild and optimize SQL queries for analytics and reporting. Use when: (1) Writing complex SQL queries, (2) Optimizing slow database queries, (3) Creating reports from database data, (4) Debugging SQL errors, (5) Building aggregated analytics.
A method included in the original pack
skills/transversal/database-query-builder/SKILL.md
Read the skill and download optionsdebug-optimize-lcpLargest Contentful Paint (LCP) measures how quickly a page's main content becomes visible. It's the time from navigation start until the largest image or text block renders in the viewport.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/chrome-devtools-mcp/skills/debug-optimize-lcp/SKILL.md
Read the skill and download optionsdebugging-and-error-recoveryGuides systematic root-cause debugging. Use when tests fail, builds break, behavior doesn't match expectations, or you encounter any unexpected error. Use when you need a systematic approach to finding and fixing the root cause rather than guessing.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/debugging-and-error-recovery/SKILL.md
Read the skill and download optionsdeprecation-and-migrationManages deprecation and migration. Use when removing old systems, APIs, or features. Use when migrating users from one implementation to another. Use when deciding whether to maintain or sunset existing code.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/deprecation-and-migration/SKILL.md
Read the skill and download optionsdeprecation-migrationCode-as-liability mindset. Every line of code carries maintenance cost. Deprecated code, unused features, and zombie code slow down development and introduce risk. Deprecation is not abandonment — it's a managed transition.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/deprecation-migration/SKILL.md
Read the skill and download optionsdocumentation-adrsArchitecture Decision Records document the WHY, not the WHAT. Document decisions at the time they're made — future you will thank present you. Code tells you what was built; ADRs tell you why it was built that way.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/documentation-adrs/SKILL.md
Read the skill and download optionsdocumentation-and-adrsRecords decisions and documentation. Use when making architectural decisions, changing public APIs, shipping features, or when you need to record context that future engineers and agents will need to understand the codebase.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/documentation-and-adrs/SKILL.md
Read the skill and download optionsfrontend-ui-engineeringBuilds production-quality UIs. Use when building or modifying user-facing interfaces. Use when creating components, implementing layouts, managing state, or when the output needs to look and feel production-quality rather than AI-generated.
A method included in the original pack
skills/verticals/web-development/skills/frontend-ui-engineering/SKILL.md
Read the skill and download optionsFrontend DeveloperExpert frontend developer specializing in modern web technologies, React/Vue/Angular frameworks, UI implementation, and performance optimization
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/engineering-frontend-developer/SKILL.md
Read the skill and download optionsghost-cmsComprehensive Ghost CMS integration for creating, publishing, scheduling, and managing blog content, newsletters, members, and analytics. Use when working with Ghost blogs for content creation (drafts, publishing, scheduling), member/subscriber management (tiers, newsletters), comment moderation, or analytics (popular posts, subscriber growth). Supports all Ghost Admin API operations including content, members, tiers, newsletters, comments, themes, and media. Requires GHOST_ADMIN_KEY and GHOST_A...
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/marketing-agency/skills/ghost-cms/SKILL.md
Read the skill and download optionsgit-workflowGit is your safety net. Treat commits as save points, branches as sandboxes, and history as documentation. Disciplined version control keeps changes manageable, reviewable, and reversible.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/git-workflow/SKILL.md
Read the skill and download optionsgit-workflow-and-versioningStructures git workflow practices. Use when making any code change. Use when committing, branching, resolving conflicts, or when you need to organize work across multiple parallel streams.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/git-workflow-and-versioning/SKILL.md
Read the skill and download optionsgsd-spec-drivenUse when starting a new project or significant feature — provides a structured workflow from idea to requirements to roadmap to implementation.
A method included in the original pack
skills/transversal/gsd-spec-driven/SKILL.md
Read the skill and download optionsheadless-cms-strategistDesign headless CMS architectures for content-driven applications. Use when: (1) Choosing a headless CMS platform, (2) Planning content API architecture, (3) Building JAMstack sites, (4) Migrating to headless, (5) Optimizing content delivery performance.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/headless-cms-strategist/SKILL.md
Read the skill and download optionsidea-refineRefines ideas iteratively. Refine ideas through structured divergent and convergent thinking. Use "idea-refine" or "ideate" to trigger.
A method included in the original pack
skills/verticals/web-development/skills/idea-refine/SKILL.md
Read the skill and download optionsincremental-implementationDelivers changes incrementally. Use when implementing any feature or change that touches more than one file. Use when you're about to write a large amount of code at once, or when a task feels too big to land in one step.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/incremental-implementation/SKILL.md
Read the skill and download optionsjavascript-testing-patternsTesting con Jest, Vitest y Testing Library: unit tests, integration tests, mocking y CI/CD integration.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/javascript-testing-patterns/SKILL.md
Read the skill and download optionsjson-canvasCreate and edit JSON Canvas files (.canvas) with nodes, edges, groups, and connections. Use when working with .canvas files, creating visual canvases, mind maps, flowcharts, or when the user mentions Canvas files in Obsidian.
A method included in the original pack
skills/transversal/json-canvas/SKILL.md
Read the skill and download optionsmemory-leak-debuggingThis skill provides expert guidance and workflows for finding, diagnosing, and fixing memory leaks in JavaScript and Node.js applications.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/chrome-devtools-mcp/skills/memory-leak-debugging/SKILL.md
Read the skill and download optionsmobile-app-developerUse this agent when developing iOS and Android mobile applications with focus on native or cross-platform implementation, performance optimization, and platform-specific user experience.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/volt-mobile-app-developer/SKILL.md
Read the skill and download optionsmobile-ux-auditorAudit mobile user experience for usability, accessibility, and conversion issues. Use when: (1) Auditing mobile-specific UX problems, (2) Investigating high mobile bounce rates, (3) Improving mobile checkout flows, (4) Testing mobile responsiveness, (5) Evaluating thumb-friendly design.
A method included in the original pack
skills/transversal/mobile-ux-auditor/SKILL.md
Read the skill and download optionsmodern-javascript-patternsDomina ES6+: async/await, destructuring, spread operators, arrow functions, promises, modules, iteradores y generators.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/modern-javascript-patterns/SKILL.md
Read the skill and download optionsnextjs-enterprisenext-enterprise (Blazity) es un boilerplate production-ready para Next.js con todas las herramientas necesarias para desarrollo profesional: TypeScript, Tailwind CSS, testing (Vitest + Playwright), linting, i18n, y arquitectura optimizada…
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/nextjs-enterprise/SKILL.md
Read the skill and download optionsnodejs-backend-patternsBackend production-ready con Node.js: Express/Fastify, middleware, error handling, authentication y deployment.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/nodejs-backend-patterns/SKILL.md
Read the skill and download optionspage-speed-optimizerDiagnose and optimize web page performance for Core Web Vitals and user experience. Use when: (1) Improving Google Core Web Vitals, (2) Reducing page load times, (3) Optimizing LCP, FID, and CLS metrics, (4) Analyzing PageSpeed Insights reports, (5) Optimizing images and assets.
A method included in the original pack
skills/transversal/page-speed-optimizer/SKILL.md
Read the skill and download optionsperformance-optimizationOptimizes application performance. Use when performance requirements exist, when you suspect performance regressions, or when Core Web Vitals or load times need improvement. Use when profiling reveals bottlenecks that need fixing.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/performance-optimization/SKILL.md
Read the skill and download optionsplanning-and-task-breakdownBreaks work into ordered tasks. Use when you have a spec or clear requirements and need to break work into implementable tasks. Use when a task feels too large to start, when you need to estimate scope, or when parallel work is possible.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/planning-and-task-breakdown/SKILL.md
Read the skill and download optionspython-anti-patternsDetecta anti-patterns en Python: checklist de malas practicas para code review. Mejorar calidad delcodigo existente.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-anti-patterns/SKILL.md
Read the skill and download optionspython-background-jobsPython background job patterns including task queues, workers, and event-driven architecture. Use when implementing async task processing, job queues, long-running operations, or decoupling work from request/response cycles.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-background-jobs/SKILL.md
Read the skill and download optionspython-design-patternsPatrones de diseno en Python: KISS, Separation of Concerns, SOLID, DRY. Incluye ejemplos practicos y refactorizaciones.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-design-patterns/SKILL.md
Read the skill and download optionspython-error-handlingPython error handling patterns including input validation, exception hierarchies, and partial failure handling. Use when implementing validation logic, designing exception strategies, handling batch processing failures, or building robust APIs.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-error-handling/SKILL.md
Read the skill and download optionspython-observabilityPython observability patterns including structured logging, metrics, and distributed tracing. Use when adding logging, implementing metrics collection, setting up tracing, or debugging production systems.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-observability/SKILL.md
Read the skill and download optionspython-packagingCrea paquetes Python distribuibles: project structure, setup.py/pyproject.toml y publicacion en PyPI.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-packaging/SKILL.md
Read the skill and download optionspython-performance-optimizationProfile and optimize Python code using cProfile, memory profilers, and performance best practices. Use when debugging slow Python code, optimizing bottlenecks, or improving application performance.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-performance-optimization/SKILL.md
Read the skill and download optionspython-resiliencePython resilience patterns including automatic retries, exponential backoff, timeouts, and fault-tolerant decorators. Use when adding retry logic, implementing timeouts, building fault-tolerant services, or handling transient failures.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-resilience/SKILL.md
Read the skill and download optionspython-testing-patternsTesting con pytest: fixtures, mocking, parametrizacion y test-driven development. Ejemplos reales de projects.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/python-testing-patterns/SKILL.md
Read the skill and download optionsrepo-to-prompt-generatorGiven a public GitHub repository URL or owner/repo pair, this skill extracts the project structure, README, and metadata — then synthesizes a conversational AI prompt that can be pasted into any coding agent (Cursor, Claude Code, Codex,…
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/repo-to-prompt-generator/SKILL.md
Read the skill and download optionssecurity-and-hardeningHardens code against vulnerabilities. Use when handling user input, authentication, data storage, or external integrations. Use when building any feature that accepts untrusted data, manages user sessions, or interacts with third-party services.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/security-and-hardening/SKILL.md
Read the skill and download optionsshipping-and-launchPrepares production launches. Use when preparing to deploy to production. Use when you need a pre-launch checklist, when setting up monitoring, when planning a staged rollout, or when you need a rollback strategy.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/shipping-and-launch/SKILL.md
Read the skill and download optionsskeleton-loaders-boneyardSkill para generar skeleton loaders que coinciden pixel-perfect con tu layout real. Automatiza la creación de placeholders de carga sin esfuerzo manual.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/skeleton-loaders-boneyard/SKILL.md
Read the skill and download optionsspec-driven-developmentCreates specs before coding. Use when starting a new project, feature, or significant change and no specification exists yet. Use when requirements are unclear, ambiguous, or only exist as a vague idea.
A method included in the original pack
skills/verticals/web-development/skills/spec-driven-development/SKILL.md
Read the skill and download optionssystematic-debuggingUse when encountering any bug, test failure, or unexpected behavior, before proposing fixes.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/systematic-debugging/SKILL.md
Read the skill and download optionsTechnical WriterExpert technical writer specializing in developer documentation, API references, README files, and tutorials. Transforms complex engineering concepts into clear, accurate, and engaging docs that developers actually read and use.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/engineering-technical-writer/SKILL.md
Read the skill and download optionstest-driven-developmentDrives development with tests. Use when implementing any logic, fixing any bug, or changing any behavior. Use when you need to prove that code works, when a bug report arrives, or when you're about to modify existing functionality.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/test-driven-development/SKILL.md
Read the skill and download optionstroubleshootingYou are acting as a troubleshooting wizard to help the user configure and fix their Chrome DevTools MCP server setup. When this skill is triggered (e.g., because listpages, newpage, or navigatepage failed, or the server wouldn't start),…
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/chrome-devtools-mcp/skills/troubleshooting/SKILL.md
Read the skill and download optionstypescript-advanced-typesTypeScript avanzado: generics, conditional types, mapped types, template literals, utility types y patterns.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/typescript-advanced-types/SKILL.md
Read the skill and download optionsui-ux-pro-maxUI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, and mobile...
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/transversal/ui-ux-pro-max/SKILL.md
Read the skill and download optionsusability-test-runnerPlan, conduct, and analyze usability tests for products and designs. Use when: (1) Planning usability tests, (2) Recruiting test participants, (3) Conducting usability sessions, (4) Analyzing usability findings, (5) Reporting usability results.
A method included in the original pack
skills/transversal/usability-test-runner/SKILL.md
Read the skill and download optionsuser-journey-mapperMap customer and user journeys to identify touchpoints and improvement opportunities. Use when: (1) Creating user journey maps, (2) Identifying customer touchpoints, (3) Finding UX pain points, (4) Planning customer experience improvements, (5) Documenting customer processes.
A method included in the original pack
skills/transversal/user-journey-mapper/SKILL.md
Read the skill and download optionsuser-persona-builderCreate and use customer personas for product and marketing decisions. Use when: (1) Building user personas, (2) Researching customer profiles, (3) Validating personas with data, (4) Using personas in decision-making, (5) Creating marketing segmentations.
A method included in the original pack
skills/transversal/user-persona-builder/SKILL.md
Read the skill and download optionsusing-agent-skillsDiscovers and invokes agent skills. Use when starting a session or when you need to discover which skill applies to the current task. This is the meta-skill that governs how all other skills are discovered and invoked.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/using-agent-skills/SKILL.md
Read the skill and download optionsuv-package-managerDomina uv: gestion ultra-rapida de dependencias Python, virtual environments y project workflows modernos.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/uv-package-manager/SKILL.md
Read the skill and download optionsux-friction-detectorIdentify and diagnose user experience friction points that harm conversion. Use when: (1) Auditing UX for conversion barriers, (2) Investigating high drop-off pages, (3) Planning UX improvements, (4) Analyzing form abandonment, (5) Evaluating checkout flow issues.
A method included in the original pack
skills/transversal/ux-friction-detector/SKILL.md
Read the skill and download optionsux-researchSkill comprehensivo de investigación UX que cubre desde la definición de objetivos hasta el análisis de resultados y la creación de artefactos como personas, journey maps, y reportes de usabilidad.
A method included in the original pack
skills/transversal/ux-research/SKILL.md
Read the skill and download optionsUX ResearcherExpert user experience researcher specializing in user behavior analysis, usability testing, and data-driven design insights. Provides actionable research findings that improve product usability and user satisfaction
A method included in the original pack
skills/transversal/design-ux-researcher/SKILL.md
Read the skill and download optionsvisual-qa-playwrightQA visual sistemático de páginas web con Playwright: captura y revisión con ojos de cada cambio, errores de consola, aserciones geométricas (solapes, alineación, pliegue), sonda de parseo CSS y auditoría de enlaces y anclas. Triggers: verificar web, QA visual, screenshot test, comprobar maquetación, revisar antes de entregar.
A method included in the original pack
- Tools and access
- Using this method may require compatible tools, a connected account and authorisation. The skill does not provide those integrations or carry out external actions by itself.
skills/verticals/web-development/skills/visual-qa-playwright/SKILL.md
Read the skill and download optionsweb-development-masterSkill comprehensivo de desarrollo web que cubre desde HTML semantico hasta arquitectura de aplicaciones, performance optimization, y seguridad.
A method included in the original pack
skills/transversal/web-development-master/SKILL.md
Read the skill and download optionsweb-quality-auditComprehensive web quality audit covering performance, accessibility, SEO, and best practices. Use when asked to "audit my site", "review web quality", "run lighthouse audit", "check page quality", or "optimize my website".
A method included in the original pack
skills/transversal/web-quality-audit/SKILL.md
Read the skill and download optionsweb-quality-skillsOptimiza la calidad web de tus proyectos usando Lighthouse y Core Web Vitals. Agent skills para developers.
A method included in the original pack
skills/transversal/web-quality-skills/SKILL.md
Read the skill and download optionsNo skills match this search. Try another task or name.
Looking for ways to frame your request? Browse the example library across our featured sectors.
Browse examplesTHE COMPLETE COLLECTION
Your next task.
A method to begin.
Download the AI for Web Development pack and choose the skills that fit the task you need to tackle.
Create a free accountAlready have an account? Sign in to download
ZIP · Version 1.0.1 · 296.9 KB · Free with your account
What you download
- 79 skill methods from this collection.
- Their original instructions and associated resources, where included.
- A pack to explore: select and install the skills your tool supports.
The pack is not a single ready-made installation for every platform. Instructions and available formats are explained in the guides and individual skill pages.
Find your platform guideSOURCE AND SCOPE
SkillsBundle brings together methods with different authors and licences. Check the source, licence and requirements of each resource before applying it. The method helps you organise the work; you provide the context and review the result.
Terms and licences