Saltar para o conteúdo principal

Documentation Index

Fetch the complete documentation index at: https://docs.replit.com/llms.txt

Use this file to discover all available pages before exploring further.

​
Importar do Figma

⏰ Tempo estimado: três minutos Importe um frame do Figma para o Replit e converta o design em um aplicativo React funcional. Para opções de importação abrangentes, incluindo outras plataformas como GitHub, Bolt e Lovable, consulte a documentação do recurso de Importação.

​
Antes de começar

  • Um arquivo do Figma com um frame que você deseja importar
  • Acesso para conectar sua conta do Figma
  • Uma conta no Replit

​
Passos de importação

  1. Abra replit.com/import.
  2. Selecione Figma.
  3. Conecte sua conta do Figma.
  4. No Figma, selecione um frame e copie sua URL.
  5. Cole a URL no Replit.
  6. Selecione Importar.

​
O que é importado

  • Tema e estilo de componentes
  • Imagens e ícones
  • Estrutura de projeto para um projeto React

​
Melhorar a qualidade da conversão

  • Use layout automático sempre que possível.
  • Mantenha os nomes das camadas curtos e descritivos.
  • Converta grupos em frames antes da importação.
  • Marque camadas de imagem para exportação.

​
Configure and run your app

During import, . If your app needs changes, use these Project Editor tools:
  • Agent: Refine features, debug issues, and make code changes
  • Secrets: Add API keys and environment variables
  • Workflows: Set the Run command for your app

​
Limites de importação

O Figma limita a frequência com que você pode importar com base no seu plano e tipo de assento do Figma. Esses limites são definidos pelo Figma, não pelo Replit.
  • Assentos Free, Starter, View e Collab: 1 importação por mês.
  • Assentos Dev e Full (planos Pro, Organization ou Enterprise): Limites mais altos com limites por minuto e diários.
Se você atingir um limite de taxa durante a importação, faça upgrade para um assento Dev ou Full do Figma para maior acesso. Consulte a documentação de planos e permissões do Figma para detalhes completos.

​
Interaja no chat do Agent (beta)

Após a importação, você pode colar links do Figma no chat do Agent para inspecionar camadas, extrair tokens e solicitar alterações no código. Um assento Dev ou Full do Figma é recomendado para os recursos de chat do Agent. Assentos Free e Starter estão limitados a 6 chamadas de ferramenta MCP por mês. Consulte o guia: Integração Figma MCP.

​
Continue your journey

Now that you’ve imported your , explore these next steps: