> ## 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. # Editar elementos > Selecione e edite as peças individuais dentro de um frame no Canvas. Um **Element** é uma peça individual dentro de um frame, como um título, um botão, uma imagem, um campo de formulário ou qualquer outro componente que o frame renderiza. Elements são o que você seleciona quando quer alterar uma peça de um frame sem regenerar tudo. Canvas com a ferramenta Edit ativa — um elemento de imagem em um artefato de Website está selecionado (destacado em azul com um rótulo 'img'), e o painel do Editor Visual mostra os controles Layout (Outer/Inner space), Color (Opacity) e Border (color, width, radius), além dos botões Discard e Save edits. ## Selecionando um elemento Use a [ferramenta Edit](/pt/features/design/toolbar#edit) na barra de ferramentas. Com o Edit ativo, clique dentro de um frame ativo para selecionar o elemento sob o cursor. O elemento selecionado recebe um contorno de destaque e um pequeno prompt inline onde você pode pedir ao Agent que o altere. O Edit fica desabilitado até que exista pelo menos um frame no Canvas, e está disponível apenas para desktop. ## Agindo em um elemento selecionado ### Peça ao Agent para alterá-lo Peça ao Agent para atualizar o texto, a cor, o layout, o espaçamento ou o comportamento do elemento usando o prompt inline. Close-up do prompt inline para um elemento selecionado no Canvas: um rótulo 'img' seguido pelo texto de espaço reservado 'Ask about selected element…' e um botão de envio. ### Inspecionar elemento Inspecione o elemento pelo botão **Inspect** da barra de ações do frame, que abre o **Editor Visual** direcionado a esse elemento. Uma página de detalhes do McLaren 765LT em modo de foco (rotulada 'Preview: Velocity — Supercar Rental' no canto inferior direito) com o elemento de imagem do McLaren selecionado (destacado em azul com um rótulo 'img'). O painel do Editor Visual está aberto, mostrando o caminho da fonte da imagem, um botão Upload Image, e as seções Layout, Color e Border. O Inspect só está disponível enquanto o frame está em modo de foco e o elemento é um nó DOM selecionável. ## Editor Visual Selecionar um elemento abre o **Editor Visual** — um painel no lado direito, combinado com o prompt inline. O painel agrupa todos os controles em seções claras para que você encontre o que precisa mais rápido: **Text**, **Layout**, **Color** e **Border**. (A seção **Image** também aparece quando você seleciona um elemento de imagem.) Canvas com um elemento div selecionado (a barra lateral de reserva do McLaren). O painel do Editor Visual à direita mostra Text (Font size 16, Font weight Regular, Alignment), Layout (Outer space 0/0, Inner space 20/20 com alternadores de vínculo, mais um gap de 24px), Color (Text #e4e4e7) e as seções Background. ### Layout A seção **Layout** é onde você ajusta como os filhos se posicionam dentro de um contêiner sem passar pelo Agent. Selecione um contêiner flex, expanda o Layout e você terá: * **Alignment**: um seletor de pontos 3×3 para onde os itens se posicionam em ambos os eixos dentro do contêiner. * **Direction**: dois botões de seta que organizam os filhos em linha ou em coluna. * **Gap**: um valor em pixels para o espaço entre os itens. O ícone ao lado do campo Gap muda para corresponder à direção atual, então você sempre sabe se está ajustando o espaçamento horizontal ou vertical. Ao lado dele, um ícone de seta alterna **Distribute space between items**, que empurra os filhos para as bordas opostas do contêiner. * **Outer space**: campos por lado para o espaço fora do elemento (um campo por lado, com um alternador de vínculo para travar os quatro lados de uma vez). * **Inner space**: campos para o espaço dentro do elemento em cada eixo, com um alternador de vínculo para ambos os eixos de uma vez. A seção Layout só aparece quando pelo menos um controle de layout se aplica ao elemento selecionado. Nós de texto simples sem propriedades de espaçamento ou layout ocultam a seção completamente, então o editor permanece compacto. Para as seções **Text**, **Color**, **Border** e **Image**, consulte o [guia do Editor Visual](/pt/learn/design/visual-editor). ## Páginas relacionadas * [Canvas](/pt/features/design/canvas) — visão geral e anatomia. * [Frames](/pt/features/design/frames) — os contêineres onde os Elements vivem. * [Toolbar](/pt/features/design/toolbar) — onde a ferramenta Edit está localizada. * [Editor Visual](/pt/learn/design/visual-editor) — passo a passo completo de edição de elementos.