O que é o MiroMiro?
O MiroMiro é uma extensão do Chrome que permite inspecionar, copiar e exportar ativos de design de qualquer site sem abrir o DevTools. Passe o mouse sobre qualquer elemento para capturar instantaneamente seu CSS, cores, fontes e espaçamentos. Baixe imagens, SVGs e animações Lottie com um clique. Extraia tokens de design completos e exporte-os como configuração Tailwind ou variáveis CSS. Criado para designers e desenvolvedores que querem parar de reconstruir do zero e começar a entregar mais rápido.
Para quem é
- Desenvolvedores frontend que precisam fazer engenharia reversa de componentes de UI e copiar Tailwind + HTML prontos para produção diretamente para o Cursor, Claude ou v0
- Designers que desejam extrair cores da marca, fontes e tokens de design de sites ao vivo sem vasculhar o DevTools
- Construtores no-code que precisam capturar ativos, animações e sistemas de design rapidamente para acelerar seu fluxo de trabalho
Principais recursos
Inspetor ao Vivo
Passe o mouse sobre qualquer elemento em um site ao vivo para ver seu CSS. Altere uma cor, fonte ou espaçamento inline e veja a página ser atualizada em tempo real. Copie seus valores editados como CSS ou Tailwind sem perder as alterações ao recarregar.
Exportar para Código
Clique em qualquer elemento e obtenha Tailwind + HTML limpo e semântico pronto para colar no Cursor, Claude ou v0. Chega de adivinhar ou descrever a UI para sua IA — o código exato é seu com um clique.
Extrator de Ativos
Capture qualquer imagem na qualidade original sem inspecionar o DOM. Exporte como PNG, JPG ou WebP. Extraia SVGs inline, ícones ou ilustrações como vetores reais — totalmente editáveis. Baixe animações Lottie como JSON para usar no After Effects ou LottieFiles.
Extração de Tokens de Design
Extraia todas as cores, fontes, raios e sombras de um site ao vivo como configuração Tailwind ou variáveis CSS brutas. Selecione qualquer pixel ou extraia uma paleta de marca completa e exporte hex, RGB, HSL ou OKLCH diretamente para Tailwind, Figma ou seu sistema de design.
O que se destaca
"Chega de vasculhar devtools para encontrar cores, fontes, espaçamentos, ativos — tudo está ali instantaneamente."
O MiroMiro elimina o atrito da inspeção de design tradicional. Em vez de navegar por árvores complexas do DevTools, você passa o mouse, clica e copia. A extensão é executada inteiramente localmente — nada sai do seu navegador. Você pode salvar componentes, cores e ativos para construir um arquivo pessoal de referência que cresce a cada site que visita. Também inclui verificação de contraste WCAG integrada para pares de texto e UI contra os padrões AA e AAA.
Vale a pena conferir se…
Você está cansado de descrever a UI para sua IA ou de tirar capturas de tela que não se traduzem em código real. O MiroMiro é especialmente útil se você frequentemente faz engenharia reversa de landing pages, reconstrói UIs rapidamente ou deseja extrair sistemas de design de sites ao vivo sem inspeção manual. É gratuito para começar com um teste Pro de 3 dias e sem necessidade de cartão de crédito.
