Sobre o projeto

ui-clone-skills é um plugin para agentes de codificação (compatível com Claude Code e Codex) projetado para reverter sites ao vivo em código React e Tailwind CSS. Diferentemente das ferramentas padrão de captura de tela para código, que inferem layout a partir de pixels, esta ferramenta realiza "forense de movimento" inspecionando o DOM ao vivo, baixando CSS e ativos reais e extraindo parâmetros de animação de bundles JavaScript (incluindo GSAP, Framer Motion e Webflow IX2). O pipeline consiste em quatro estágios principais: 1. Captura: Registra quadros de referência, vídeos e mapas DOM em múltiplos viewports e estados de interação. 2. Decodificação: Extrai folhas de estilo, valores computados e cria um `transition-spec.json` para parâmetros de movimento. 3. Recreação: Gera código React/TSX e Tailwind com base nos dados observados. 4. Verificação: Usa métricas determinísticas como Erro Absoluto (AE) e Similaridade Estrutural (SSIM) para comparar a implementação com a referência. Fornece três habilidades principais: `ui-reverse-engineering` para o pipeline completo, `ui-capture` para coletar evidências de referência e `visual-debug` para diagnosticar discrepâncias entre o clone e o site original.