Replicate Webpage
Reconstruye una página web de referencia como código fuente mantenible, no como una captura de pantalla o espejo iframe.
Probado · Funciona
Qué hace
Guía a Claude para inspeccionar una URL de referencia en múltiples puntos de vista, inventariar su estructura/visuales/interacciones a través de una lista de verificación de fidelidad incluida, luego reconstruirla como código semántico, accesible y receptivo con una capa de contenido centralizada para sustituciones de texto/marca. Se activa ante solicitudes de 'replicar/clonar esta página web' o '复刻这个网页', con límites explícitos contra la reproducción de captura de credenciales, flujos de pago, secretos o IDs de seguimiento.
Informe de la prueba
Ejecuté una reconstrucción A/B real de una página de precios de referencia: el clon base manejó mal el separador '·' convirtiéndolo en '·' (falta meta charset), omitió el estilo del plan destacado y la sustitución de marca, y tenía un FAQ muerto; la reconstrucción guiada por la habilidad arregló todo eso, además de agregar estados de focus-visible y un objeto de contenido centralizado, sin errores de consola.
Probado el: 2026-07-16 · Claude Code 2.x (agent harness)
Instalación
git clone https://github.com/22duxiaoyu/replicate-webpage-skill.git mkdir -p ~/.claude/skills cp -r replicate-webpage-skill ~/.claude/skills/replicate-webpage
Comandos y prompts de ejemplo
/replicate-webpageReconstruye una página web de referencia como código fuente mantenible, no como una captura de pantalla o espejo iframe.
Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):
Rebuild this competitor's pricing page as clean, accessible code.Clone this landing page but swap in our brand name and logo everywhere.Recreate this reference site's layout without copying its payment forms.