Designmd.fun

Designmd.fun é uma ferramenta de engenharia reversa de UI e geração de contexto para IA. Cole a URL de qualquer site público e a ferramenta renderiza a página como um visitante real a veria, analisa o design system por trás dela e gera um conjunto completo de arquivos de documentação legíveis por máquina.

Segundo o site, uma única análise produz dez arquivos prontos para IA por URL: um design.md de produção, tailwind.config.ts, tokens.json, components.md, animations.md, prompt.md, figma.json e css-vars.css, além de JSON de cores e tipografia. Cada arquivo é gerado ao mesmo tempo e referenciado entre si para que os resultados permaneçam consistentes.

O fluxo de trabalho é propositalmente curto: cole uma URL, deixe o analisador agrupar cores em papéis, tipografia em uma escala e espaçamento em um ritmo, gere o conjunto de arquivos e baixe um ZIP que você pode colocar em um repositório ou colar diretamente em um agente de código. A paleta extraída é apresentada como amostras clicáveis para cópia rápida.

Tudo o que a ferramenta extrai é descrito como proveniente da página renderizada e abrange design system, componentes de UI, grade de layout, breakpoints, animações e movimento, raio de borda, sombras, fontes, ícones, paleta de cores e acessibilidade. A saída é voltada para Claude Code, Cursor, Windsurf, ChatGPT, Lovable, Bolt, v0 e GitHub Copilot, com direcionamento de prompt pronto para cópia para Claude, Cursor, Windsurf, Lovable e v0.

O Designmd.fun também publica uma biblioteca de design systems de produção pré-analisados — Stripe, Linear, Vercel, Notion, Framer, Raycast, Supabase, Airtable, Cursor, PostHog, Resend, Warp e Webflow estão entre os sites listados — para que você possa navegar pela documentação de referência sem executar sua própria análise. O site afirma que não é necessário cadastro para experimentar.

Como usar o Designmd.fun

1. Abra o site. Acesse designmd.fun e localize o campo de URL em “Website URL to analyze”.
2. Cole uma URL pública. Insira o domínio de um site público, por exemplo stripe.com, ou escolha um dos links de exemplo (stripe.com, linear.app, github.com, vercel.com). A ferramenta renderiza a página exatamente como um visitante a vê.
3. Deixe a IA analisá-la. As cores são agrupadas em papéis, a tipografia em uma escala e o espaçamento em um ritmo.
4. Gere os arquivos. Dez formatos são criados ao mesmo tempo e referenciados entre si para garantir consistência.
5. Baixe o ZIP e coloque-o no seu repositório, ou copie um prompt pronto para Claude, Cursor, Windsurf, Lovable ou v0 diretamente do painel de exportação.
6. Opcional: explore a biblioteca de designs pré-analisados (Stripe, Linear, Vercel, Notion e outros) caso você queira apenas documentação de referência.

O Designmd.fun informa um endereço de e-mail de suporte: support@designmd.fun. Nenhum outro canal de suporte, portal de documentação ou compromisso de tempo de resposta é apresentado nas evidências fornecidas.