> ## Documentation Index
> Fetch the complete documentation index at: https://docs.lumi.new/llms.txt
> Use this file to discover all available pages before exploring further.

# Edições Visuais

> Faça edições de design precisas diretamente na interface.

As Edições Visuais do Lumi permitem que você selecione qualquer elemento em sua página para modificá-lo diretamente. Atualize instantaneamente propriedades como texto e cor, ou use prompts para ajustar a funcionalidade e o layout. É a ferramenta ideal para fazer alterações rápidas e direcionadas sem escrever nenhum código ou usar IA.

<Note>
  **Observação:** O uso das Edições Visuais não consome créditos.
</Note>

<img src="https://mintcdn.com/blockdance/yVzLgDWOMQWyvNCE/images/VE.gif?s=c13d93006af083d7b1bad8f01ce4cebd" alt="VE Gi" width="1280" height="720" data-path="images/VE.gif" />

## Quando Usar as Edições Visuais

As Edições Visuais são ideais para quando você deseja:

* Alterar texto estático ou conteúdo de mídia em seu site.
* Atualizar a tipografia, incluindo fontes, tamanhos e estilos.
* Modificar as cores de texto, botões ou outros elementos.
* Selecionar um elemento específico e usar um prompt para alterar sua aparência visual ou funcionalidade. Observe que esses prompts consomem créditos assim como uma mensagem padrão.
* Aplique edições com tecnologia de IA a imagens existentes em seu site por meio de prompts. Observe que o recurso Editar com IA consome créditos de chat, assim como uma mensagem padrão.

  <img src="https://mintcdn.com/blockdance/Si-KBGUqnPsHTPfG/images/%E5%8F%AF%E8%A7%86%E5%8C%96%E7%BC%96%E8%BE%91.PNG?fit=max&auto=format&n=Si-KBGUqnPsHTPfG&q=85&s=9629b8803fd29e92b4e5002857ab40ca" alt="可视化编辑" width="1280" height="962" data-path="images/可视化编辑.PNG" />

## Como Usar as Edições Visuais

<Steps>
  <Step title="Localize as Edições Visuais">
    Você pode encontrar esta ferramenta na caixa de entrada ou na barra de ferramentas superior no modo de Visualização.

    <img src="https://mintcdn.com/blockdance/yVzLgDWOMQWyvNCE/images/20250911-184540.jpeg?fit=max&auto=format&n=yVzLgDWOMQWyvNCE&q=85&s=7d2c75ec60807782e3844a5afd94751d" alt="20250911 184540 Jpe" width="3840" height="1916" data-path="images/20250911-184540.jpeg" />
  </Step>

  <Step title="Ative a Ferramenta">
    Clique no botão para entrar no modo de Edições Visuais.
  </Step>

  <Step title="Selecione um Elemento">
    Passe o mouse sobre o item que deseja modificar — um título, botão, imagem ou seção de fundo — e clique para selecioná-lo.

    <img src="https://mintcdn.com/blockdance/yVzLgDWOMQWyvNCE/images/20250911-184025.jpeg?fit=max&auto=format&n=yVzLgDWOMQWyvNCE&q=85&s=9637a2ab63470ab62b99069f401b6b07" alt="20250911 184025 Jpe" width="1905" height="1186" data-path="images/20250911-184025.jpeg" />
  </Step>

  <Step title="Edite por Prompt ou Controles Diretos">
    Uma vez que um elemento é selecionado, digite um comando como "Deixe este título em negrito" ou use o editor contextual para alterar diretamente texto, fontes e cores.

    <img src="https://mintcdn.com/blockdance/yVzLgDWOMQWyvNCE/images/20250911-183835.jpeg?fit=max&auto=format&n=yVzLgDWOMQWyvNCE&q=85&s=71158959d69d6ca9639c73ceb4bc5e0b" alt="20250911 183835 Jpe" width="1076" height="1344" data-path="images/20250911-183835.jpeg" />
  </Step>

  <Step title="Aplique e Revise">
    Clique em "Salvar" para confirmar suas alterações. O Lumi atualizará instantaneamente a visualização ao vivo e o código correspondente.
  </Step>
</Steps>
