Web to MCP

Web to MCP es una extensión de Chrome que te permite capturar cualquier componente de un sitio web activo y enviarlo directamente a asistentes de programación con IA como Cursor y Claude Code. En lugar de tomar capturas de pantalla, escribir descripciones o intentar adivinar el estilo, haces clic en el icono de la extensión, seleccionas el elemento que deseas y la estructura completa del DOM y el estilo visual se transmiten a través del Model Context Protocol (MCP). El asistente de IA recibe una referencia exacta al píxel, por lo que puede recrear el componente con precisión.

La configuración es sencilla. Instala la extensión desde la Chrome Web Store, inicia sesión con tu cuenta de Google y configura MCP en tu IDE —Cursor o Claude Code—. La extensión genera una URL de MCP única que añades al archivo de configuración de tu proyecto. Una vez conectado, navegas por cualquier sitio web, haces clic en el icono de la extensión y seleccionas el componente. Se copia un ID de referencia en tu portapapeles, que puedes pegar en el chat del asistente de IA para importar los datos completos del componente. Todo el proceso tarda unos 30 segundos.

Esta herramienta está creada para desarrolladores frontend y diseñadores que utilizan asistentes de programación con IA para generar o modificar código de UI. Es especialmente útil cuando encuentras un diseño que quieres replicar —un botón, una tarjeta, una barra de navegación— y necesitas que la IA lo imite exactamente. Al eliminar las conjeturas y el ir y venir de describir elementos visuales, Web to MCP convierte la inspiración en implementación mucho más rápido. Funciona con cualquier stack tecnológico y cualquier sitio web, lo que la convierte en una adición práctica al kit de herramientas de un desarrollador.