Skip to content
SkillsBundleby SANTACONCHA
ES EN
All collections

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.

79 skills in this collectionOriginal methods and associated resourcesFree download with an account

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.

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 options
a11y-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 options
ads-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 options
api-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 options
api-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 options
api-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 options
astro-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 options
async-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 options
browser-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 options
browser-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 options
chrome-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 options
chrome-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 options
ci-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 options
ci-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 options
CMS 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 options
code-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 options
code-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 options
Code 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 options
context-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 options
core-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 options
database-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 options
debug-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 options
debugging-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 options
deprecation-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 options
deprecation-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 options
documentation-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 options
documentation-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 options
frontend-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 options
Frontend 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 options
ghost-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 options
git-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 options
git-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 options
gsd-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 options
headless-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 options
idea-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 options
incremental-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 options
javascript-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 options
json-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 options
memory-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 options
mobile-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 options
mobile-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 options
modern-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 options
nextjs-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 options
nodejs-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 options
page-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 options
performance-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 options
planning-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 options
python-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 options
python-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 options
python-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 options
python-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 options
python-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 options
python-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 options
python-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 options
python-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 options
python-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 options
repo-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 options
security-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 options
shipping-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 options
skeleton-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 options
spec-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 options
systematic-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 options
Technical 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 options
test-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 options
troubleshootingYou 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 options
typescript-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 options
ui-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 options
usability-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 options
user-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 options
user-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 options
using-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 options
uv-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 options
ux-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 options
ux-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 options
UX 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 options
visual-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 options
web-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 options
web-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 options
web-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 options

Looking for ways to frame your request? Browse the example library across our featured sectors.

Browse examples

THE 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 account

Already 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 guide

SOURCE 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