Antes de você começar
Quem pode usar este recurso
Disponível em qualquer plano
Qualquer pessoa que tiver acesso do tipo "para visualização" ao arquivo consegue exportar ativos desde que o proprietário do arquivo não tenha restringido a cópia e o compartilhamento no arquivo
Qualquer pessoa que tiver acesso do tipo "para edição" ao arquivo consegue usar a ferramenta Porção
Exporte conteúdo para compartilhar designs com outras pessoas, movimentar conteúdo entre ferramentas ou salvar cópias do seu trabalho fora do Figma.
Dica: alguns objetos podem ser copiados e colados entre ferramentas de design. Clique com o botão direito do mouse em um objeto, passe o mouse sobre Copiar/Colar como e selecione Copiar como PNG ou Copiar como SVG.
Selecionar conteúdo para exportação
É possível exportar os seguintes itens a partir do Figma Design:
- Camadas, estruturas, componentes, grupos ou seções. Saiba mais sobre seleção de objetos no Figma →
- Uma parte da tela usando a ferramenta Porção.
- A tela inteira de uma página.
- O arquivo inteiro como arquivo .fig. Saiba mais sobre como salvar uma cópia local de um arquivo →
Selecione parte do seu design para exportar usando a ferramenta Porção
Se o seu acesso a um arquivo for do tipo "para edição", você poderá usar a ferramenta Porção para selecionar e exportar uma parte da sua tela. Isso é útil para compartilhar partes do fluxo de trabalho do seu design ou para criar capturas de tela de alta qualidade.
A ferramenta Porção está localizada sob o menu suspenso das ferramentas Região na barra de ferramentas. Para criar uma porção, clique e arraste a ferramenta Porção em torno da região que deseja exportar. É possível mover e redimensionar a porção conforme necessário. Lembre-se de que somente o conteúdo dentro dos limites da porção será exportado. Depois que a porção estiver posicionada onde você deseja, você poderá aplicar configurações de exportação a ela como qualquer outro objeto.
Dica: as porções também permitem controlar o preenchimento ao redor do objeto exportado. Caso contrário, o preenchimento será calculado a partir dos limites gerais da forma. Este último se ajusta quando a forma muda de tamanho, enquanto a porção é absoluta.
Localizar as configurações de exportação
Depois de selecionar o conteúdo que deseja exportar, é possível criar configurações de exportação usando as definições na seção Exportar. A localização da seção Exportar é diferente, dependendo do seu nível de acesso ao arquivo e do modo que você esteja usando.
Observação: caso não veja a seção Exportar, experimente atualizar a página. Se não funcionar, talvez o proprietário do arquivo tenha restringido os visualizadores de poder copiar ou exportar ativos a partir do arquivo. Saiba mais sobre como restringir a cópia e o compartilhamento em arquivos →
Modo Design
Se o seu acesso a um arquivo for do tipo "para edição", a seção Exportar estará localizada na parte inferior da barra lateral direita.
Se o seu acesso a um arquivo for do tipo "para visualização", a seção Exportar estará localizada abaixo da aba Exportar, na barra lateral direita.
Modo de desenvolvimento
Se estiver usando o modo de desenvolvimento, a seção Exportar estará localizada na barra lateral direita, mas somente estará visível se um objeto estiver selecionado.
Adicionar uma configuração de exportação
Use a seção Exportar para escolher qual formato de arquivo e configurações de exportação serão aplicados à seleção.
- Selecione as camadas que deseja exportar. Caso deseje exportar a tela inteira da página atual, desmarque todas as seleções feitas na tela.
- Clique no botão mais na seção Exportar para adicionar uma configuração de exportação. Você pode adicionar quantas configurações de exportação forem necessárias a uma seleção.
- Defina as configurações de exportação. Saiba mais sobre Formatos e configurações de exportação no Figma →
Dica: caso esteja exportando uma estrutura com um preenchimento, você poderá ocultar o preenchimento no arquivo exportado desmarcando a caixa de seleção Mostrar nas exportações na seção Preenchimento na barra lateral direita.
- (Opcional) Clique em Pré-visualização para ver como o seu ativo ficará. Caso tenha vários objetos selecionados, a configuração Pré-visualização não será exibida.
- Clique em Exportar.
Caso utilize o Figma no navegador, o arquivo exportado será enviado ao local de download definido nas preferências do navegador. Caso utilize o aplicativo para desktop do Figma, você precisará renomear o arquivo e escolher para onde enviar a exportação.
Observação: caso use uma convenção de nomenclatura separada por barras, os objetos exportados serão organizados em pastas aninhadas correspondentes à estrutura da nomenclatura. Por exemplo, se você exportar uma camada com o nome “button/pill/default”, ela será exportada aninhada em pastas chamadas “button”, “pill” e o arquivo será nomeado como “default”.
Exportar em massa todas as seleções com as configurações de exportação
É possível exportar em massa todas as seleções de sua página atual que tenham uma configuração de exportação aplicada.
- Clique no Menu principal e selecione Arquivo > Exportar nas opções. Você também pode usar o atalho de teclado:
- Mac: Shift Command E
- Windows: Shift Ctrl E
- O modo Exportar exibe todas as seleções com configurações de exportação aplicadas. Para cada seleção é possível:
- Visualizar a escala, o formato e a dimensão do ativo
- Passar o mouse sobre o nome da miniatura ou da camada para visualizar o nome do arquivo exportado
- Clicar na miniatura para visualizar uma seleção na tela
- Desmarque a caixa ao lado das seleções que você não deseja exportar.
- Clique em Exportar para exportar os ativos selecionados.