getdesign.md vs Design Extractor
O Design Extractor gera um DESIGN.md a partir de qualquer URL pública que você informar. O arquivo segue a especificação DESIGN.md do Google e entrega cada componente que ele seleciona na página como uma receita de HTML e CSS que seu agente de código consegue reconstruir. Cada receita é verificada no site real ou sinalizada com o motivo. O Design Extractor também funciona em sites que só respondem a visitantes de certos países.
O getdesign.md é uma coleção com curadoria de arquivos DESIGN.md prontos de marcas conhecidas. Veja como os dois se comparam. Ainda não conhece o formato? Leia o que é um DESIGN.md.
Verificado em com base em getdesign.md, sua página de solicitação, a página do Catalog Pass e o repositório awesome-design-md. Ofertas e preços mudam, então confira o site deles antes de decidir.
Por que o Design Extractor
Segue a especificação DESIGN.md do Google
O front matter YAML usa apenas as propriedades que a especificação define, sem chaves personalizadas de nível superior. As seções canônicas vêm na ordem da especificação, de Overview a Do's and Don'ts. As entradas de componentes no front matter usam apenas as oito propriedades da especificação, com valores literais. Verifique qualquer arquivo com o Validador de DESIGN.md gratuito.
Uma receita para cada componente que ele seleciona na página
O cabeçalho, o rodapé, os botões, os campos de entrada, os cards e outros componentes selecionados na página vêm, cada um, como uma receita: HTML e CSS enxutos com valores literais, dentro da seção Components do DESIGN.md. Cada receita lista suas partes e os estados de hover e foco vistos no site, para que seu agente de código reconstrua o componente em vez de adivinhá-lo.
Verificado no site real
Cada receita é renderizada isoladamente e verificada no site real: uma correspondência estrutural das partes renderizadas com o que foi medido na página e uma comparação de pixels com uma captura nova do elemento real. Uma receita que falha é reconstruída e verificada de novo. Se ainda assim não passar, ela é sinalizada com o motivo, nunca entregue como verificada. A página de resultado mostra o quanto os componentes correspondem e quantas das cores e dos estilos de texto do site estão cobertos: veja o Stripe na galeria.
Funciona em sites com restrição regional
Alguns sites só respondem a visitantes de certos países. Quando uma extração falha por isso, a página de resultado oferece um seletor de país, com primeiro os países de onde detectamos que a página carrega, e executa a mesma extração por um navegador no país que você escolher. Uma extração a partir de outro país custa o preço do modo Pro mais uma taxa adicional de 6 em créditos (16 créditos no total). Se a extração falhar, devolvemos seus créditos.
Lado a lado
| getdesign.md | Design Extractor | |
|---|---|---|
| Conformidade com a especificação | Usa a estrutura da especificação DESIGN.md do Google: tokens no front matter YAML e as seções canônicas na ordem da especificação. | Segue a especificação DESIGN.md do Google: front matter apenas com as propriedades da especificação e sem chaves personalizadas de nível superior, as seções canônicas na ordem da especificação e entradas de componentes limitadas às oito propriedades da especificação, com valores literais. |
| Receitas de componentes | Os componentes são definidos como tokens no front matter e descritos em texto corrido, sem HTML. | Cada componente que ele seleciona na página, como o cabeçalho, o rodapé, os botões, os campos de entrada e os cards, vem como uma receita: HTML e CSS enxutos na seção Components, para que seu agente de código possa reconstruí-lo. |
| Verificado no site real | Não oferecido | Sim. Cada receita é renderizada isoladamente e verificada no site real: uma correspondência estrutural das suas partes e uma comparação de pixels. Um componente que não passa é sinalizado com o motivo, nunca entregue como verificado. |
| Sites com restrição regional | Os arquivos vêm do catálogo ou de uma solicitação privada. | Sim. Quando um site bloqueia visitantes de alguns países, a extração que falhou oferece um seletor de país, com primeiro os países de onde a página carrega, e executa a mesma extração por um navegador nesse país. Uma extração a partir de outro país custa o preço do modo Pro mais uma taxa adicional de 6 em créditos (16 créditos no total). |
| O que é | Uma coleção com curadoria de arquivos DESIGN.md analisados a partir de sites reais, mantida pela equipe da VoltAgent. | Um gerador: você informa uma URL pública e ele devolve o DESIGN.md desse site. |
| Qualquer site sob demanda | Não de forma imediata. Para um site fora do conjunto gratuito, você envia uma solicitação privada paga, e o arquivo é entregue na sua caixa de entrada. | Sim. Cole qualquer URL pública e a extração começa na hora. O DESIGN.md abre na página de resultado quando ela termina. |
| Arquivos gratuitos | Sim. Um conjunto gratuito que você pode baixar ou instalar com npx getdesign@latest add stripe. 84 desses arquivos também estão no repositório awesome-design-md no GitHub, sob a licença MIT. | As extrações são pagas. A galeria de arquivos DESIGN.md que já extraímos é gratuita para ler e copiar. |
| Cobertura | Um catálogo de sites com 551 sites. Fora do conjunto gratuito, uma entrada do catálogo mostra uma prévia e oferece uma solicitação paga, não um download. | Qualquer site público, mais uma pequena galeria de marcas já extraídas. |
| Preço | Conjunto gratuito: grátis. DESIGN.md privado: US$ 39 em pagamento único (preço de tabela US$ 59). Catalog Pass: US$ 99 por mês por 45 arquivos com curadoria, com 5 ou mais adicionados a cada mês. | Créditos pré-pagos, sem assinatura. Os pacotes começam em US$ 5 por 50 créditos; uma extração Pro custa 10 créditos. Os créditos nunca expiram. |
| Como o arquivo é feito | Uma análise independente dos padrões publicamente observáveis do site, com curadoria como ponto de partida para inspiração. | Renderizado a partir do site real em um navegador, no momento em que você executa a extração. O modo Pro analisa uma amostra das páginas principais do site. |
| Atualização | Um retrato do momento em que o site foi analisado. As entradas não mostram data de análise. | Tão atual quanto o momento em que você executa a extração. Extrair de novo depois é uma nova extração, cobrada. |
| Acesso para agentes | Uma CLI que instala um DESIGN.md pelo nome. Sem servidor MCP nem API. | Um servidor MCP para Claude Code, Cursor, Codex, ChatGPT e outros clientes, e uma extensão do Chrome para a aba em que você está. |
| Extras | Prévias ao vivo de cada arquivo em modo claro e escuro, e kits iniciais (o kit de site custa US$ 249 em pagamento único, preço de tabela US$ 299). | Ferramentas gratuitas: um validador de DESIGN.md, um identificador de fontes de sites e um extrator de paleta de cores. |
O que o getdesign.md oferece
- Um conjunto gratuito de arquivos DESIGN.md de marcas conhecidas, a maioria também no GitHub como awesome-design-md, sob a licença MIT.
- Instalação em uma linha pelo terminal com npx getdesign.
- Prévias ao vivo de cada arquivo em modo claro e escuro.
- Arquivos DESIGN.md privados de outros sites sob solicitação, entregues por e-mail, e um Catalog Pass mensal.
- Kits iniciais, como um kit de site.
Uma coleção vs qualquer URL sob demanda
Uma coleção é rápida quando a marca que você quer está nela. Seu próprio produto, o site de um cliente ou um concorrente pequeno raramente estão em algum catálogo. O getdesign.md resolve isso com uma solicitação privada paga, entregue por e-mail.
O Design Extractor resolve com uma extração que você mesmo executa: cole a URL na página inicial e o DESIGN.md é feito a partir do site real, com receitas verificadas nele. Veja arquivos prontos na galeria.
Como migrar do getdesign.md
- Cole a URL do site na página inicial do Design Extractor e execute uma extração Pro.
- Salve o resultado como DESIGN.md na raiz do seu repositório, substituindo o arquivo antigo, e mantenha a referência no AGENTS.md ou CLAUDE.md. Verifique o arquivo com o Validador de DESIGN.md gratuito se você editá-lo à mão.
- Ou deixe seu agente fazer isso: conecte o servidor MCP e peça para ele extrair o site.
Veredito
Escolha o Design Extractor se você precisa de um DESIGN.md de qualquer site sob demanda, não apenas de um catálogo, com receitas de componentes verificadas no site real. Ele lê o site como ele está no momento em que você executa a extração e segue a especificação do Google, com uma receita para cada componente que seleciona na página; uma receita que não passa é sinalizada com o motivo. Seu agente pode iniciar extrações sozinho pelo servidor MCP.
Outros comparativos
designmd.me vs Design Extractor
Dois geradores de DESIGN.md a partir de uma URL comparados em conformidade com a especificação, receitas de componentes, verificações no site real e preço.
Refero Styles vs Design Extractor
Uma grande biblioteca gratuita de estilos de sites comparada a um DESIGN.md conforme a especificação, com receitas de componentes verificadas no site real, a partir de qualquer URL.
TypeUI vs Design Extractor
A extensão do Chrome gratuita do TypeUI, que preenche o próprio template a partir dos estilos da sua aba, comparada a um DESIGN.md conforme a especificação, com receitas de componentes verificadas no site real.
FAQ
getdesign.md vs Design Extractor: perguntas
Respostas curtas sobre o getdesign.md e o Design Extractor, verificadas em 2026-10-20.
Em parte. O conjunto gratuito do getdesign.md, em grande parte também no GitHub como awesome-design-md sob a licença MIT, pode ser baixado ou instalado com npx getdesign. Um DESIGN.md privado de outro site custa US$ 39 em pagamento único, e o Catalog Pass custa US$ 99 por mês. Preços verificados em 2026-10-20.
Sim, como uma solicitação privada paga: você envia a URL e eles entregam o arquivo na sua caixa de entrada. Em 2026-10-20, o site não tinha um gerador instantâneo de autoatendimento. O Design Extractor gera um DESIGN.md a partir de qualquer URL pública assim que você executa a extração.
Sim. O front matter usa apenas as propriedades da especificação, sem chaves personalizadas de nível superior, as seções canônicas vêm na ordem da especificação e as entradas de componentes usam apenas as oito propriedades da especificação, com valores literais. O Validador de DESIGN.md gratuito verifica qualquer arquivo em relação à especificação.
Cada receita é renderizada isoladamente e comparada com o site real: uma correspondência estrutural das suas partes com o que foi medido na página e uma comparação de pixels com uma captura nova do elemento real. Uma receita que falha é reconstruída e verificada de novo; se ainda assim não passar, ela é sinalizada com o motivo.
Não. As extrações usam créditos pré-pagos: os pacotes começam em US$ 5 por 50 créditos e uma extração Pro custa 10 créditos. Os créditos nunca expiram e não há assinatura. Navegar pela galeria e usar as ferramentas gratuitas não custa nada.
Sim. Os dois entregam um DESIGN.md que você coloca no seu repositório e indica para o seu agente. Migrar para o Design Extractor não muda a configuração do seu agente.
Tenha um DESIGN.md do site de que você precisa
Cole qualquer URL pública. O modo Pro analisa uma amostra das páginas principais do site e entrega um DESIGN.md conforme a especificação, com receitas de componentes verificadas no site real.