> ## Documentation Index
> Fetch the complete documentation index at: https://help.scribe-mail.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Painel de estilos

> Estilize qualquer bloco de assinatura pelo painel de estilos à direita, com seções de conteúdo, estilo, tamanho e layout, além de controles de espaçamento, cores da marca e links.

O painel de estilos é onde você controla a aparência da sua assinatura de e-mail. Selecione qualquer bloco no canvas e o painel à direita atualiza para mostrar todas as opções disponíveis para aquele elemento.

Pense nele como uma ferramenta de design: clique em algo e estilize à direita.

<Frame>
  <img src="https://mintcdn.com/scribe/xbQhr3JjkYildsKM/images/styling-panel-overview.png?fit=max&auto=format&n=xbQhr3JjkYildsKM&q=85&s=fbe79897221564aa33255c61d52f34cc" alt="Painel de estilos mostrando as seções de configuração de bloco à direita" width="3456" height="1930" data-path="images/styling-panel-overview.png" />
</Frame>

<Note>
  As opções exibidas dependem do bloco selecionado. Um bloco de texto mostra configurações de fonte e cor. Um [bloco de imagem](/pt-BR/editor/image-blocks) mostra opções de tamanho e recorte. Cada tipo de bloco tem seu próprio conjunto de controles.
</Note>

## Como funciona

O painel de estilos é organizado em seções consistentes que aparecem conforme o tipo de bloco:

* **Configurações de conteúdo**: o que o bloco contém (valores de texto, conexões com Smartfield, fonte da imagem, links)
* **Estilo**: como ele aparece (cores, fontes, formatação, variantes de ícone)
* **Tamanho**: dimensões quando aplicável (largura, altura)
* **Layout**: como ele se posiciona na assinatura (espaçamento, espaço entre elementos, alinhamento, direção)

Nem todo bloco tem as quatro seções. Um [bloco de texto](/pt-BR/editor/text-blocks) simples pode mostrar apenas configurações de conteúdo e estilo, enquanto um [bloco de contêiner](/pt-BR/editor/containers-and-columns) foca em layout e alinhamento.

Quando nenhum bloco está selecionado, o painel mostra "Add or select a block to start editing." Clique em qualquer elemento no canvas ou adicione um novo bloco pelo painel da esquerda para começar.

***

## Controles comuns

Esses controles aparecem em vários tipos de bloco e funcionam da mesma forma em todos os lugares.

### Espaçamento interno

Todo bloco tem controles de espaçamento interno na seção Layout. O espaçamento interno é o espaço entre a borda do bloco e os elementos ao redor.

Você pode definir o espaçamento interno globalmente (um valor para todos os lados) ou expandir o controle para definir cada lado individualmente: Superior, Direita, Inferior, Esquerda.

<Frame>
  <img src="https://mintcdn.com/scribe/xbQhr3JjkYildsKM/images/styling-panel-padding-controls.png?fit=max&auto=format&n=xbQhr3JjkYildsKM&q=85&s=3edd74259c5840ea98b18cc7ea1a8161" alt="Controles de espaçamento interno com configurações individuais por lado no painel de estilo" title="Controles de espaçamento interno com configurações individuais por lado no painel de estilo" className="mx-auto" style={{ width:"65%" }} width="614" height="320" data-path="images/styling-panel-padding-controls.png" />
</Frame>

### Seletor de cor

Em qualquer lugar onde você vir um campo de cor, clicar nele abre o seletor de cor com:

* Um gradiente de cores para seleção visual
* Um controle deslizante de matiz para escolher a cor base
* Um campo hexadecimal para inserir valores exatos de cor
* Suas **cores da marca** na parte inferior para acesso rápido à paleta de cores da sua empresa

### Cores da marca

As cores da marca são compartilhadas entre todos os seus modelos de assinatura. Editar uma cor da marca atualiza essa cor em todos os lugares onde ela é usada. Altere o azul da sua marca uma vez e todas as assinaturas que usam essa cor são atualizadas automaticamente.

Você pode adicionar novas cores da marca com o botão **+** diretamente no seletor de cor.

<Frame>
  <img src="https://mintcdn.com/scribe/xbQhr3JjkYildsKM/images/styling-panel-brand-color-picker.png?fit=max&auto=format&n=xbQhr3JjkYildsKM&q=85&s=2f172379c312fe4e84f783c436945901" alt="Seletor de cor com paleta de cores da marca no painel de estilo" title="Seletor de cor com paleta de cores da marca no painel de estilo" className="mx-auto" style={{ width:"58%" }} width="926" height="1250" data-path="images/styling-panel-brand-color-picker.png" />
</Frame>

### Links

A maioria dos blocos aceita links. O campo de link aceita qualquer URL e torna o bloco clicável na assinatura final, útil para direcionar tráfego ao seu site, página de agendamento ou perfis de redes sociais.

<Frame>
  <img src="https://mintcdn.com/scribe/xbQhr3JjkYildsKM/images/styling-panel-link-input.png?fit=max&auto=format&n=xbQhr3JjkYildsKM&q=85&s=89e49bc6fb843fbd5ab4eadf91963cee" alt="Campo de entrada da URL do link no painel de estilo" title="Campo de entrada da URL do link no painel de estilo" className="mx-auto" style={{ width:"64%" }} width="694" height="586" data-path="images/styling-panel-link-input.png" />
</Frame>

## Artigos relacionados

* [Visão geral do editor](/pt-BR/editor/editor-overview)
* [Adicionar blocos](/pt-BR/editor/add-blocks)
* [Área de edição](/pt-BR/editor/canvas)
