O Figma Sites foi lançado em versão beta aberta durante a Config 2025. Atualmente, está disponível em todos os planos pagos, com uma experiência limitada no plano Iniciante chegando em breve. Saiba mais sobre o que está incluído na versão beta.
Quem pode usar este recurso
Disponível em todos os planos pagos
Requer acesso de edição no arquivo de destino
Você pode copiar e colar objetos livremente entre o Figma Design e o Figma Sites — embora existam vários recursos que funcionem de maneira diferente em cada produto.
Dica: quer saber mais sobre as diferenças entre esses produtos? Saiba mais sobre as ferramentas e propriedades disponíveis no Figma Sites e no Figma Design.
Copie do Figma Design para o Figma Sites
Você pode copiar e colar quaisquer recursos de design entre o Figma Design e o Figma Sites usando os atalhos de teclado padrão para copiar e colar:
- Copiar: Ctrl ou Cmd C
- Colar: Ctrl ou Cmd V
Se a largura de seu design estiver entre 1200 e 1600px (e você for o criador do arquivo), você também pode enviá-lo diretamente para um novo arquivo do Figma Sites:
- Abra o arquivo do Figma Design que contém seu design.
- Clique com o botão direito do mouse no quadro que você deseja adicionar como uma página da web ao Figma Sites.
- Selecione Copiar para o Figma Sites.
O Figma abrirá um novo arquivo de site com seu design adicionado à página Início.
Coisas a considerar
Aqui estão algumas coisas a serem observadas ao migrar do Figma Design para o Figma Sites:
|
Recurso |
Comportamento |
|---|---|
|
As anotações não são exibidas em um arquivo de site, mas reaparecem se você copiar e colar o design de volta no Figma Design posteriormente. |
|
|
O posicionamento de cada elemento é baseado nas propriedades configuradas no Figma Design:
|
|
|
A maioria das conexões de protótipo é automaticamente convertida para as interações correspondentes no Figma Sites. Aprenda a solucionar problemas de interações não compatíveis. |
Copiar do Figma Sites para o Figma Design
Você pode copiar e colar manualmente os recursos de design do Figma Sites para o Figma Design usando os mesmos atalhos de teclado padrão mencionados acima.
Dica: existem várias maneiras de modificar como o conteúdo é colado no Figma Design, como colar para substituir, colar sobre a seleção e muito mais.
Coisas a considerar
Aqui estão algumas coisas a ter em mente ao migrar do Figma Sites para o Figma Design:
| Recurso | Comportamento |
|---|---|
|
As propriedades de acessibilidade não são exibidas em um arquivo de design, mas reaparecem se você copiar e colar o design de volta no Figma Sites posteriormente. |
|
|
Incorporações não são compatíveis com o Figma Design e aparecem como imagens estáticas na tela de trabalho. |
|
|
Se disponíveis, as interações serão automaticamente convertidas para as conexões de protótipo correspondentes, mas muitas interações não são compatíveis com o Figma Design. |
|
|
Links para sites externos serão automaticamente convertidos em uma ação de protótipo de Abrir link no Figma Design. Links internos para outras páginas da web dentro de um site não serão copiados para o Figma Design. |
|
|
O posicionamento de cada elemento é baseado nas propriedades configuradas no Figma Sites:
|
|
|
Cada página da web é convertida em uma seção com quadros para cada ponto de quebra. |