Deutsch 
Español 
Français 
日本語 
한국어 
Polski 
Weblify vs html.to.design
Uma alternativa ao html.to.design para copiar sites para o Figma.
Copie uma página web ou um elemento selecionado no Chrome e cole no Figma com a extensão gratuita do Weblify. Leve o site que você está vendo para o arquivo de design como camadas editáveis.
Extensão gratuita do Weblify para Google Chrome
Thanks so much, Adam!... saved me many, many hours of manual work.
html.to.design ou Weblify?
Compare o fluxo de trabalho e escolha a ferramenta ideal para o seu próximo projeto.
| html.to.design |  Com o Weblify |
|---|---|
| Importar conteúdo de sites O html.to.design importa sites ou HTML para o Figma. | Copie da página que você está vendo Use a extensão do Chrome do Weblify na própria página do navegador. Leia o guia do Weblify |
| Levar HTML para o arquivo de design O plugin converte conteúdo web em camadas de design editáveis. | Escolha uma página ou um único elemento Capture uma referência específica quando você não precisar da página inteira. Leia o guia do Weblify |
| Usar um plugin de importação dedicado O html.to.design oferece um fluxo de site para Figma. | Cole direto da área de transferência Copie com a extensão gratuita e cole o conteúdo capturado em um arquivo do Figma. Leia o guia do Weblify |
Extensão gratuita para o Google Chrome. Copie sua primeira página ou elemento para o Figma.
Baixe a extensão gratuita para ChromeEscolha seu fluxo de trabalho
Escolha a ferramenta certa para cada trabalho.
Veja na prática
O que você pode fazer com o Weblify.
Conheça os recursos por trás do fluxo de trabalho, com demonstrações e guias de configuração.
Copie qualquer site para o Figma com a extensão gratuita para Chrome.
Copie uma página inteira ou escolha um único elemento no Chrome e cole no Figma como camadas editáveis com a extensão gratuita do Weblify.
- Cópia de páginas inteiras
- Seleção de um único elemento
- Camadas editáveis no Figma
Inspecione qualquer camada do Figma como HTML, Tailwind, React ou Vue.
Selecione uma camada do Figma e inspecione o código HTML, Tailwind, React ou Vue gerado ao lado do design; depois, copie ou baixe a implementação.
- Inspeção de HTML e CSS
- Saída em Tailwind
- Saída em React e Vue
Teste com um projeto real
Leve o fluxo de trabalho para o Weblify.
Comece com um arquivo representativo antes de mudar o processo da equipe.
Weblify ProO que verificar antes de trocar.
Esta comparação cobre a extensão gratuita do Chrome do Weblify, separada da inspeção de código Pro. A qualidade da captura depende da página; confira fontes, imagens e layout antes de usar o design importado.
Leia o guia do fluxo de trabalho- Instale a extensão gratuita do Weblify para Chrome e abra a página web desejada.
- Copie a página inteira ou use Pick element para o conteúdo de que você precisa.
- Cole no Figma e confira as camadas editáveis em relação à página original.
Perguntas frequentes
O que saber antes de começar.
Quando devo escolher o Weblify em vez do html.to.design?
Designers que querem um fluxo do navegador para a área de transferência e para o Figma, com páginas inteiras ou elementos específicos.
Quando o html.to.design é a melhor opção?
Equipes que preferem o plugin dedicado de importação de sites e HTML do html.to.design.
O que devo verificar antes de trocar?
Esta comparação cobre a extensão gratuita do Chrome do Weblify, separada da inspeção de código Pro. A qualidade da captura depende da página; confira fontes, imagens e layout antes de usar o design importado.
Posso testar o Weblify antes de fazer upgrade?
Extensão gratuita do Weblify para Google Chrome. A extensão para Chrome é separada da inspeção de código do Weblify Pro.
Orçamento em PDF ↗ 
