A marca
O que o escritório defende, como fala e o que nunca faz. Todo o resto do manual serve a estas frases.
a tese
Patrimônio, família, empresa e impostos são uma coisa só.
Decidir uma frente sem olhar as outras é onde o dinheiro se perde: a clínica que paga imposto errado, a herança que vira briga, o sócio que vira problema. O escritório pensa todas as frentes acopladas e entrega uma decisão só.
É tese, e não slogan: os concorrentes mapeados vendem uma frente, holding ou recuperação de imposto. A Almeida Nascimento vende o conjunto, inclusive no formulário de equiparação, que é a porta de entrada tributária para o mesmo cliente.
o lema
Tudo o que você construiu, pensado junto.
para peça curta
Uma decisão. Todas as frentes.
Frase de marketing leva ponto final; título de tela, não.
a sensação
Escritório de arquitetura: a planta sobre a mesa.
Chão claro, tinta Capa e um fio que marca o resultado. Tudo medido e nomeado: número com unidade e rótulo, foto real em luz natural. As partes se encaixam num conjunto, como numa planta, nunca como diagrama abstrato.
Personalidade
| traço | o que faz | o que nunca faz |
|---|---|---|
| Inteiro | Mostra o conjunto antes da parte. Cada peça cita as frentes que toca. | Vender uma frente isolada como se fosse tudo. |
| Medido | Dá número, prazo e condição, com o rótulo antes do valor. | Adjetivo no lugar de número. “Milhões” sem conta. |
| Sereno | Fala como quem já viu o caso antes, em frases curtas. | Urgência falsa, ponto de exclamação, caixa alta. |
| Próximo | Quem conduz o caso aparece no fechamento e ao lado da ação. | Jargão sem tradução. “Eu” como estrutura do texto. |
| Responsável | A ressalva vem legível, uma vez, no lugar certo. | Promessa de resultado. Letra miúda apagada. |
Como a marca escreve
- Fala com donos de clínica, empresários e famílias com patrimônio, de 40 anos ou mais, em segunda pessoa: “você”, “a sua clínica”, “o que você construiu”.
- Frase curta, uma ideia por frase. Português do Brasil, sempre com acento.
- Título inteiro, sem palavra em destaque: nem negrito, nem cor. O que chama a atenção é o número com o fio Palha, quando existe.
- Botão é verbo + objeto e diz o que acontece: “Estimar a economia da clínica”. O aviso repete o verbo no particípio: “Documento enviado”. Sem seta.
- Sem promessa de resultado (Provimento 205/2021 da OAB). Toda estimativa leva a ressalva uma vez, legível, no fim do bloco.
- Nome completo: Almeida Nascimento Advocacia. Curto: Almeida Nascimento. Nunca “Almeida & Nascimento”, “Almeida Nascimento Advogados” ou “AN Advocacia”: a sigla AN existe só no símbolo e no avatar.
O que a marca nunca é
Clichê jurídico
Balança, martelo, coluna grega, estante de livros, preto com dourado brilhante.
Cara de consultoria financeira
Verde-água, letra de aplicativo de banco, gráfico subindo. Nada que lembre marcas de terceiros.
Promessa gritada
“Economize milhões”, vermelho, contagem regressiva, urgência falsa.
Luxo ostensivo
Mármore, dourado metálico, letra rebuscada, carro e mansão.
Também ficaram de fora, por decisão das rodadas anteriores: chão escuro em página inteira, diagrama abstrato como assinatura e arquitetura de laudo com faixa técnica repetida.
No lugar disso: papel, luz natural e números com rótulo.
O símbolo
O monograma AN: o A e o N entrelaçados em quatro peças, o A, o floreio, a diagonal e a haste do N. É o desenho que o escritório já usava, agora reconstruído em vetor. Diz “duas linhas que se entrelaçam numa só”: a tese em forma, sem precisar explicar.
fidelidade ao desenho original
97,7%
- teto: as exportações do escritório entre si
- 99,1% a 99,3%
- desvio médio do contorno
- 0,26 px
- desvio máximo fora das pontas
- 2,51 px
Medido no arquivo entregue, a 512 px de altura, contra as três exportações do monograma em uso: sobreposição de área de 0,9768, com meta de 0,95.
Original e reconstrução
Não existia vetor do monograma, só imagens pequenas. O novo desenho foi medido contra elas: o resultado está perto do teto, que é o quanto as próprias exportações do escritório concordam entre si. Acima disso, a medida passaria a medir o serrilhado das imagens, e não o desenho.
O que foi limpo
- As duas diagonais agora são paralelas, com o mesmo ângulo e a mesma largura. A fresta entre o A e o N ficou constante.
- Os topos e as caudas pousam numa linha só.
- As curvas perderam as quinas e as pontas ficaram limpas, em vetor.
Ficou como estava, porque é desenho e não ruído: o fio do A que se abre de cima para baixo, a cunha entre a perna do A e o floreio e os balanços diferentes das serifas da haste.
Quanto custou a limpeza: o mesmo ajuste sem nenhuma limpeza dá 98,0%; com limpeza, 97,7%. Diferença de 0,28 ponto percentual.
Construção
O desenho é geometria calculada. O gerador constrói as quatro peças a partir de 105 parâmetros (ângulos, larguras, linhas de topo e de base, frestas e alças das curvas), ajustados por mínimos quadrados ao contorno medido. Nenhum ponto foi digitado nem colado de traçado automático.
Versão pequena
De 24 px para baixo entra a versão pequena: a mesma construção, com quatro ajustes para o desenho não virar mancha. É dela que saem o favicon e os ícones de app.
| ajuste | por quê |
|---|---|
| O fio do A engrossa para dentro; a borda de fora não se move. | A 16 px, o fio de 0,2 px sumia e o A virava uma barra só. |
| O A e o floreio se afastam do N. | A fresta que separa as duas letras precisa de 1 px. |
| O pé da haste encosta na cauda. | A fresta teria 0,15 px e viraria uma mancha cinza. |
| O corte da perna direita do A sobe pela perna. | Abre a cunha até o floreio, que a 16 px se fundia com a perna. |
O logo
A assinatura é o monograma ao lado de “Almeida Nascimento”, em Literata 500, sobre “Advocacia”, em Literata itálico na cor Fumo. O nome está desenhado em curvas dentro do arquivo e nunca é redigitado.
A horizontal é a padrão
Quatro versões, cada uma no seu lugar
Horizontal
A padrão: cabeçalho do site, documentos, trilho do formulário, rodapé, cartão e e-mail.
Vertical
Só no avatar e em capa quadrada, onde a horizontal não cabe.
Símbolo
Favicon, ícone de app, avatar, Carregando, estado vazio, login e o monograma grande da pasta.
Símbolo pequeno
De 24 px para baixo: favicon e ícones de sistema.
Três fundos, e só estes
Capa sobre Algodão
O padrão. Nome a 12,1:1; “Advocacia” a 6,4:1.
Capa sobre Pedra
O segundo fundo. Nome a 9,5:1; “Advocacia” a 5,0:1.
Algodão sobre Capa
Capas e aberturas, com “Advocacia” em Pedra. Nome a 12,1:1; “Advocacia” a 9,5:1.
Nunca: dourado ou Palha, contorno, sombra, gradiente, relevo no arquivo, distorção, moldura, girado, sobre foto, outra fonte no nome ou nome em caixa alta.
Respiro e tamanho mínimo
O respiro x é um terço da altura do símbolo. Nessa faixa em volta não entra nada: nem texto, nem borda, nem outra marca.
Símbolo: 24 px de lado. Abaixo disso, a versão pequena.
Horizontal: 157 px de largura, no mínimo. Nesse tamanho, “Advocacia” tem 9 px de corpo.
Vertical: 117 px de largura, no mínimo.
em tamanho real, na tela
Favicon, ícone de app e avatar
O favicon sai da versão pequena, posta na grade de 16 px: a borda da haste e a linha do topo caem em pixel inteiro, e por isso valem também em 32 e 48 px. O ícone de app e o avatar usam o monograma sozinho, sem luz e sem sombra.
Almeida Nascimento Advocacia
Movimento
Na abertura dos vídeos, as quatro peças do monograma chegam, cada uma pelo próprio eixo, e se encaixam em 1,3 segundo: o A sobe pelo fio, o floreio desliza pela corda, a diagonal desce a 57,6° e a haste cai na vertical. Saem firmes e assentam devagar, como uma folha pousando na mesa, sem quique. Esse movimento aparece só aqui e no Carregando.
a abertura, ao vivo
1,3 s, na curva da marca: as peças saem firmes e assentam devagar. Os deslocamentos de partida são os mesmos do vídeo.
Com o movimento reduzido ligado no aparelho, o monograma aparece montado.
Nomes dos arquivos
Os arquivos estão na skill da marca, em assets/logos/, e na pasta da identidade, em identidade/logo/. SVG para tela e gráfica; PNG para onde SVG não entra, como e-mail e redes.
| arquivo | o que é | onde usar |
|---|---|---|
| horizontal-capa-sobre-algodao.svg | Assinatura horizontal, Capa | Padrão, sobre Algodão |
| horizontal-capa-sobre-pedra.svg | Assinatura horizontal, Capa | Sobre Pedra |
| horizontal-algodao-sobre-capa.svg | Assinatura horizontal, Algodão e Pedra | Sobre a pasta: capas e aberturas |
| vertical-…-sobre-….svg | Assinatura vertical, nos mesmos três fundos | Avatar e capa quadrada |
| simbolo-capa.svg, simbolo-algodao.svg | Monograma completo | Acima de 24 px |
| simbolo-pequeno-capa.svg, simbolo-pequeno-algodao.svg | Monograma, versão pequena | 24 px ou menos |
| favicon.svg, favicon.ico, favicon-16 a 512.png | Favicon, Capa; também em Algodão | Aba do navegador e atalhos |
| icone-app-marca.svg, icone-app-algodao.svg | Ícone de app, em 180, 512 e 1024 px | Celular e área do cliente |
| avatar-capa-1080.png, avatar-algodao-1080.png | Foto de perfil | WhatsApp, Instagram e redes |
| abertura-algodao.mp4, abertura-capa.mp4 | Abertura em vídeo, 4 s | Início de vídeos e apresentações |
Cores
A variação vem do papel, nunca de uma cor nova. São cinco cores, todas de material, e não existe sexta cor fora dos gráficos e dos status.
-
Algodão
#F2ECE1
o papel
Chão de tudo: páginas, propostas, posts e a área do cliente. Na tela, o cartão é o mesmo papel do chão, separado por fio.
É também o texto sobre a Capa, a 12,1:1.
-
Pedra
#DAD2C4
a mesa
Fios e divisórias; o item ativo, o botão secundário, a opção escolhida e o campo [a preencher]; a faixa onde as folhas pousam e o trilho do formulário. Nunca o chão da página inteira.
Capa sobre Pedra a 9,5:1; Fumo sobre Pedra a 5,0:1.
-
Capa
#172C42
a tinta e a pasta
Texto, título, número, monograma e o botão principal. Como superfície, só a pasta: capa de documento, seção escura pontual, slide de capítulo e frente do cartão.
12,1:1 sobre Algodão. Um tom acima dela, o Selo (#1F3754) pinta o monograma grande sobre a pasta.
-
Fumo
#5A544D
o apoio
Texto secundário, rótulo em itálico, borda de campo e “Advocacia” na assinatura.
6,4:1 sobre Algodão. Nunca sobre a Capa, onde mede 1,9:1.
-
Palha
#A08755
o fio
Só fio e traço: a linha do resultado, a linha do total de uma tabela e o fio do cartão de visita. Uma vez por tela.
2,9:1 sobre Algodão: é desenho e nunca carrega informação sozinho. Nunca texto, superfície, letra, ícone, botão ou série de gráfico.
Proporção numa peça
Algodão quase tudo. A Capa escreve, em cerca de 15% da peça. O Fumo apoia, a Pedra aparece em fio e em faixa, e a Palha num traço só.
- Algodãoquase tudo
- Pedrafio e faixa
- Capacerca de 15%
- Fumoo apoio
- Palhaum traço só
Status, só em tela de sistema
Na área do cliente, no funil do escritório e no formulário, sempre com palavra. O verde-escuro e o tijolo vêm do formulário no ar; o ocre-mostarda da atenção fica longe da Palha e do couro dos gráficos. Peça de comunicação, como site, post e proposta, não tem status.
Comparação não é status: “imposto de hoje” e “com equiparação” ficam neutros, em Capa. Nunca vermelho para um e verde para o outro.
Dados de gráfico
Três cores que só existem dentro de gráficos, sempre nesta ordem. A Capa pura reprova no validador de cores de gráfico, escura e acinzentada demais; por isso a série 1 é a Capa clareada. As três passam nas checagens de daltonismo, visão normal e contraste, no claro e no escuro.
- Capa de gráfico#2A5D91
Série 1, e a única quando o gráfico tem uma série. - Couro#784000
Série 2. - Folha#4D9568
Série 3. Mais de três: agrupe em “Outros” ou divida o gráfico.
Tema escuro, só na área do cliente
A marca não tem chão escuro. O tema escuro existe só nas telas de sistema, a área do cliente e o funil do escritório, para quem usa o aparelho no modo escuro: chão Capa, superfícies um e dois passos acima, texto Algodão, apoio Pedra e botão principal Algodão com texto Capa. Peça de comunicação é sempre clara, em qualquer tema: site, formulário, documento, post, story e e-mail.
Letra
Literata, uma família só, do site ao parecer. É gratuita, do Google Fonts, e muda de desenho com o tamanho: mais fina e contrastada no título, mais firme no texto.
- Títulos em 500, inteiros, com quebra equilibrada: nunca uma palavra sozinha na última linha.
- Texto em 400. Nunca peso acima de 600, nunca caixa alta.
- Texto corrido de 18 px e nada abaixo de 14 px: o público tem 40 anos ou mais.
Escala
Cada estilo no tamanho real. No celular, o display cai para 40 px e o título 1 para 30 px.
display72 px, entrelinha 76, peso 500; 40 px no celular
Tudo o que você construiu, pensado junto.
Topo do site e da landing, capa de documento. Literata 500; o tamanho ótico acompanha o corpo (fica mais fina e contrastada no grande). No celular, 40 px.
titulo-140 px, entrelinha 46, peso 500; 30 px no celular
Quanto a clínica fatura por mês?
Título de página e pergunta do formulário. No celular, 30 px.
titulo-230 px, entrelinha 36, peso 500
O que propomos
Título de seção de página e de documento.
titulo-321 px, entrelinha 28, peso 500
Equiparação hospitalar
Título de cartão, modal e painel.
numero40 px, entrelinha 44, peso 500
R$ 3.900 por mês
Número de indicador. O do resultado vai a 64 px (74 px na peça impressa). Algarismos alinhados e tabulares, sempre com a unidade.
rotulo16 px, entrelinha 22, peso 400, itálico
economia estimada em 12 meses
Rótulo em itálico e caixa baixa, cor de apoio: sobre o número, no cabeçalho de tabela, no grupo de menu. Nunca caixa alta (exceto siglas: OAB, CNPJ, CSLL).
corpo18 px, entrelinha 28, peso 400
Decidir uma frente sem olhar as outras é onde o dinheiro se perde.
Texto corrido, até 65 caracteres por linha. Nunca abaixo de 18 px em texto corrido.
corpo-sm16 px, entrelinha 24, peso 400
Atualizado em 06/10/2026
Texto de interface, célula de tabela, opção de formulário.
interface16 px, entrelinha 22, peso 500
Iniciar diagnóstico patrimonial
Botão, item de menu, aba.
legenda14 px, entrelinha 20, peso 400
Estimativa automática, não é parecer.
Ajuda de campo, metadado, ressalva. Nunca abaixo de 14 px.
Números e rótulos
economia estimada em 12 meses
R$ 46.800
- imposto de hoje
- R$ 8.880 por mês
- com equiparação
- R$ 4.980 por mês
- diferença
- R$ 3.900 por mês
Estimativa automática a partir do que você informou. Não é parecer: a aplicação à sua clínica depende da análise do escritório.
Dados de exemplo: clínica com R$ 100 mil por mês, metade em exames e procedimentos.
- Rótulo em itálico e caixa baixa, cor Fumo, 16 px, em cima do número. Siglas continuam em caixa alta: OAB, CNPJ, CSLL.
- Número sempre com unidade e no formato do Brasil. Número e unidade nunca se separam na quebra de linha.
- Algarismos alinhados e tabulares, para as colunas baterem.
- O resultado ganha o fio Palha, e a ressalva vem uma vez, legível, no fim do bloco.
| caso | certo | errado |
|---|---|---|
| Rótulo | imposto de hoje | IMPOSTO ATUAL: |
| Unidade | R$ 3.900 por mês | 3.900 |
| Separadores | R$ 46.800 e 12,5% | R$46,800 e 12.5 % |
| Título | Tudo o que você construiu, pensado junto. | Tudo o que você construiu, pensado junto. |
| Ressalva | Estimativa automática, não é parecer. | Economize milhões! |
Material e luz
A marca não tem luz: nada de halo, brilho, degradê, vidro ou sombra colorida. Quem faz esse papel é o material, a folha, a mesa, a pasta e o fio, e a foto real em luz natural. Na tela, tudo é chapado.
A folha e a mesa
a folha
Algodão, onde se lê.
Página, cartão, campo e documento. Na tela, a folha é o mesmo papel do chão, separada por um fio Pedra, sem sombra.
A mesa, em Pedra, é a faixa onde as folhas pousam, o trilho do formulário e o campo [a preencher] dos modelos. No site, no máximo uma faixa de mesa a cada duas seções.
A pasta
a pasta
Capa, que guarda o conjunto.
Capa de documento, seção escura pontual, slide de capítulo e frente do cartão. No máximo uma por página, e nunca o primeiro trecho. Sobre ela: texto Algodão, apoio Pedra e o monograma grande em Selo, um tom acima da pasta, no lugar do selo seco.
O fio
Palha, a linha do resultado ou do total: um por tela, um por página de documento. Como mede 2,9:1 sobre Algodão, é desenho, e o rótulo ao lado diz o que ele marca. Aparece neste manual duas vezes, longe uma da outra: na fidelidade do símbolo e no exemplo de resultado.
No papel, o monograma vira selo seco
Em relevo, sem tinta: nas capas de documento, na pasta, no cartão e no pé das propostas. É um gesto que o cartório e o diploma já ensinaram a reconhecer. Navy sobre navy na pasta, Algodão sobre Algodão na folha.
Em tela, o monograma é sempre tinta plana: no site, no ícone, no perfil e no login.
Plano na tela, relevo no papel
- Em tela, nada tem sombra: cartão, botão, menu e aviso se separam por fio ou borda. A única exceção é a folha que pousa sobre a página, no modal e no painel lateral, com a mesma sombra de papel dos mocks.
- O grão de papel, o selo seco e a sombra de papel sobre a mesa existem só no impresso e no mock do impresso.
- Gradiente em lugar nenhum: nem no fundo, nem em botão, cartão, foto ou símbolo.
- Nunca mármore, couro, madeira, dourado metálico, papel envelhecido ou textura em tela.
Composição
Toda tela usa um modelo. Escolha o modelo antes de desenhar; dentro de um bloco, o alinhamento é um só. Um título centralizado sobre um texto alinhado à esquerda está errado.
Leitura
Para marketing e documentos. Tudo alinhado à esquerda numa coluna de até 1180 px, com texto de até 65 caracteres por linha. Título, texto, botões e prova começam na mesma linha vertical.
O topo do site é uma cena só: título, frase, a ação principal com o link da segunda ação ao lado e, logo embaixo, a foto inteira em faixa, de borda a borda, com a legenda em itálico.
Centrada
Para uma ação só: login, estado vazio, confirmação e capa. Símbolo, título, texto de apoio e ação no eixo central, numa coluna de até 420 px.
Sem cartão: o fundo já é a superfície, e os campos ficam direto nele.
O trilho do formulário
No computador, o formulário em tela inteira tem o trilho à esquerda, na Pedra: a marca, o contador grande, a lista das etapas com a atual marcada e uma nota sobre para onde vão os dados. No celular, abaixo de 1024 px, o trilho vira uma barra de etapa no topo. Uma pergunta por tela, e contato só na última etapa.
Nas telas de sistema, o modelo é o Painel: menu lateral à esquerda e conteúdo alinhado à esquerda, com o título à esquerda e as ações à direita. Veja a área do cliente em Aplicações.
Uma ousadia por tela
Uma ação principal, um número com o fio Palha, uma foto. O resto fica quieto.
- Cartão só agrupa: separa um grupo entre vários na mesma tela, nunca envolve a única coisa da tela.
- Botão grande só no marketing. Em formulário e sistema, o tamanho padrão, de 48 px.
- A segunda ação do marketing é um link sublinhado ao lado do botão, nunca um segundo botão cheio.
- Nada de item sozinho numa linha: grades com o número de colunas que fecha certo.
- As quatro frentes aparecem juntas. Nunca uma frente sozinha, como se fosse tudo.
Grade e respiro
| medida | valor |
|---|---|
| Colunas | 12, com intervalo de 24 px |
| Margem lateral | 16 px no celular; 48 px a partir de 1024 px |
| Largura máxima | 1180 px |
| Respiro vertical | 32 px entre blocos, 48 px entre seções, 64 px no topo de página de marketing |
| Cantos | 2 px em etiqueta, 3 px em botão e campo, 4 px em cartão, 6 px em modal. Sem pílula: só o avatar é redondo |
Fotos em luz natural
Foto real, protagonista, inteira e sem moldura, num enquadramento de conversa, mesa ou palestra. Até a sessão de fotos no escritório, só estas três, retocadas para tirar marcas de terceiros. Nenhuma outra foto de evento vai a público.
Caio Nascimento, advogado tributarista
Nunca: foto com marca, bandeira ou telão de terceiros, banco de imagem, balança e martelo, estante de livros, mármore, mansão, carro, aperto de mão ou gráfico subindo. Nunca o símbolo ou texto sobre a foto.
Componentes
Os 37 componentes da interface, gerados para esta marca e conferidos no computador e no celular, no claro e no escuro, sem rolagem lateral. No Design System, cada um tem prévia ao vivo, instruções e o código.
abre em outra aba
Marca 2 componentes
Carregando
Carregando
As quatro peças do monograma chegam pelos próprios eixos e se encaixam, como na abertura em vídeo.
Símbolo
Simbolo
O monograma AN e a assinatura da Almeida Nascimento Advocacia.
Ações 3 componentes
Botão
Botao
Botão chapado, de canto de 3 px, sem sombra e sem seta.
Botão de ícone
BotaoIcone
Botão quadrado só com ícone, para ações repetidas em lista e cabeçalho: mais opções (⋯), fechar, editar, copiar, baixar.
Menu suspenso
MenuSuspenso
Lista de ações que abre a partir de um botão: as ações secundárias de um documento, de um cliente ou da conta.
Formulários 5 componentes
Busca e filtros
BuscaEFiltros
Campo de busca com lupa e filtros retos, sempre numa linha só acima da lista ou tabela que filtram.
Campo
Campo
Campo de texto, seleção e área de texto com rótulo em itálico sempre visível, ajuda e estado de erro; e o campo de valor em dinheiro com atalhos, do formulário de equiparação.
Escolhas
Escolhas
Caixa de marcar, opção única e interruptor: as três formas de escolher algo dentro de um formulário.
Formulário em etapas
FormularioEtapas
O formulário-isca da equiparação hospitalar (a primeira prioridade da marca).
Seleção
Selecao
Campo de escolha que abre uma lista com busca: responsável no escritório, cliente, frente do trabalho.
Navegação 7 componentes
Abas
Abas
Troca entre visões do mesmo assunto sem sair da página: as partes do caso do cliente, o período de um relatório.
Cabeçalho do site
CabecalhoSite
O topo do site e das landings: a assinatura oficial à esquerda, as quatro frentes e o escritório como links, a área do cliente sublinhada.
Navegação lateral
NavegacaoLateral
O menu lateral da Área do cliente e das telas do escritório.
Paginação e trilha
PaginacaoETrilha
Paginação embaixo de tabelas longas e trilha (breadcrumb) no topo de páginas de detalhe.
Rodapé do site
RodapeSite
O fim de toda página do site: a assinatura, o lema, os links úteis, a ressalva e a linha legal com a OAB.
Sumário
Sumario
O índice das seções de um documento (relatório, parecer, proposta, resumo de reunião).
Título de página
TituloDePagina
O título de cada página: frase inteira em Literata 500, sem palavra em destaque, e uma linha de contexto embaixo.
Conteúdo 9 componentes
Avatar
Avatar
Foto ou iniciais de uma pessoa: o responsável no escritório, o autor de uma anotação, quem está numa reunião.
Cartão
Cartao
A folha na tela: papel Algodão com um fio Pedra em volta, canto de 4 px e nenhuma sombra.
Depoimento
Depoimento
O vídeo com a fala do escritório.
Estado vazio
EstadoVazio
Tela sem dados: o monograma plano, uma frase em Literata 500, uma linha que diz o próximo passo e uma única ação.
Etiqueta
Etiqueta
Etiqueta de status com ponto e palavra, de canto de 2 px; a cor nunca carrega o sentido sozinha.
Gráfico
Grafico
Gráficos de barras e de linhas da Área do cliente, dos relatórios e das propostas, com as três cores de dados da marca.
Indicador
Indicador
O número com rótulo: o rótulo em itálico em cima, o número grande em Literata 500 com algarismos tabulares e a unidade sempre junto.
Sanfona
Sanfona
Pergunta que abre a resposta: as perguntas frequentes do site e da landing de equiparação, e detalhes que não precisam estar sempre à vista.
Tabela
Tabela
Tabela de linhas separadas por fio, como as dos documentos.
Retorno 4 componentes
Alerta
Alerta
Mensagem fixa dentro da página sobre o estado de algo: um documento que vence, uma etapa que terminou, um arquivo ilegível.
Aviso
Aviso
Aviso flutuante (toast) que confirma uma ação ou explica um erro, com título curto e uma frase.
Esqueleto
Esqueleto
Formas no lugar do conteúdo enquanto ele carrega, na mesma posição e tamanho do que vai aparecer.
Progresso
Progresso
Linha de 2 px que mostra quanto de algo já foi feito: trimestres revisados, documentos recebidos, etapas do formulário.
Sobreposições 3 componentes
Dica
Dica
Etiqueta curta que aparece ao passar o mouse ou focar: o nome de um botão só de ícone, o significado de uma sigla.
Modal
Modal
Janela que interrompe para uma decisão curta (confirmar uma exclusão) ou para uma explicação que não cabe na tela (a ajuda de uma pergunta, a política de dados).
Painel lateral
PainelLateral
Painel que desliza da direita com um formulário ou um detalhe, sem perder a lista de fundo: editar um contato do funil, ver o resumo de uma reunião.
Telas 4 componentes
Documento
Documento
O modelo de relatório, parecer, resumo de reunião e proposta em HTML que também vira PDF A4.
Funil do escritório
TelaCRM
O funil do escritório para quem chega pelo formulário de equiparação.
Topo do site
TelaLanding
O topo do site aplicando o sistema, como a apresentação aprovada.
Início da área do cliente
TelaSistema
O Início da Área do cliente (o painel simples do cliente) aplicando o sistema.
Aplicações
A marca no dia a dia. Ela foi desenhada primeiro para os materiais abaixo, nesta ordem: na dúvida, resolva primeiro como fica no item de cima.
Prioridade de uso
- Formulário-isca e landing de equiparação hospitalar.
- Site institucional.
- Documentos: proposta, parecer e relatório em PDF.
- WhatsApp, Instagram e e-mail.
- Área do cliente: o login e um painel simples.
Formulário de equiparação
Cinco etapas, como o formulário no ar: serviços, impostos, faturamento, divisão e seus dados. Uma pergunta por tela, em segunda pessoa, com atalhos de valor e sempre uma saída para quem não sabe (“Não sei ao certo”). O fim mostra o resultado com o fio Palha, as linhas que o explicam e a ressalva. A nota do trilho diz para onde vão os dados: “Suas respostas vão para a equipe do escritório, e só para ela. Nada é publicado.”
a pergunta no celular; a estimativa como uma folha do escritório, com a ressalva no pé
Propostas em PDF e DOCX
Duas propostas prontas para enviar: equiparação hospitalar, para clínicas no Lucro Presumido, e planejamento patrimonial, com patrimônio, família, empresa e impostos numa proposta só. A4 retrato, seis páginas, na mesma ordem: do ponto de partida às ressalvas do Provimento 205/2021.
Nenhum valor vem pronto: honorários e prazos entram caso a caso, nos campos [a preencher] em fundo Pedra. Ao cliente vai sempre o PDF; o DOCX é para o escritório preencher.
Arquivos: proposta-equiparacao-hospitalar.pdf e .docx; proposta-planejamento-patrimonial.pdf e .docx, com o LEIA-ME.md de como preencher.
Documento: relatório e parecer
Relatório, parecer, resumo de reunião e contrato saem do componente Documento, em HTML que também vira PDF A4: a capa na pasta, o sumário na folha, seções com rótulo em itálico e tabelas de rótulo e texto.
No PDF: margem de 14 mm em cima e embaixo e de 16 mm nas laterais; cartão e linha de tabela nunca partidos entre páginas; cabeçalho de seção nunca sozinho no pé. Efeito de fundo só na capa, e nada de marca d’água atrás do texto.
Cartão de visita
90 × 50 mm, 96 × 56 mm com sangria. Na frente, a pasta: cartolina Capa com o monograma em selo seco, grande e deslocado para a direita, e nada mais. No verso, a folha: a assinatura pequena no alto, o nome, o cargo e a OAB em itálico Fumo, um fio Palha e os contatos em coluna. Um verso para cada advogado.
Arquivos de gráfica: frente.pdf, com a matriz do relevo, verso-caio.pdf e verso-esthevan.pdf. Nunca dois logos no mesmo lado, texto na frente, canto arredondado, verniz ou dourado.
Área do cliente
Só o login e um painel simples: o Início com o caso do cliente, os trimestres, o valor a compensar, os documentos pendentes e a próxima reunião. Modelo Painel, com menu lateral e a assinatura no topo.
Segue o tema do aparelho; por isso usa a assinatura e o monograma desenhados na própria tela, que trocam de cor sozinhos no tema escuro.
Post em 1080 × 1350 e story em 1080 × 1920. A foto aprovada em cima, até 60% da altura, e o Algodão embaixo, com uma frase curta em Literata 500 à esquerda e o monograma à direita, na altura da frase; o nome e o site no pé. No story, deixe livres 250 px no topo e 340 px na base, onde ficam os controles do aplicativo.
Estes são os mocks da apresentação aprovada. Na peça publicada, o monograma vai em tinta plana Capa, porque é tela.
Foto de perfil: o monograma Algodão sobre Capa. Descrição: “Patrimônio, família, empresa e impostos, pensados juntos.” e o site.
A primeira mensagem diz quem fala e o que acontece, sem promessa e sem emoji:
Olá, aqui é o Esthevan, da Almeida Nascimento Advocacia. Respondo por aqui em horário comercial, na ordem de chegada.
Assinatura de e-mail
Uma tabela simples: a assinatura horizontal em PNG à esquerda, um fio Pedra vertical e, à direita, o nome, o cargo e a OAB em itálico Fumo e o site sublinhado. Fonte Georgia, com Times New Roman de reserva: programas de e-mail não carregam fonte da web, e a Georgia é a serifa de sistema mais próxima da Literata. Nunca Arial nesta marca.
Peças finais
As peças finais saíram das regras acima, geradas pela própria skill da marca. Cada uma pode ser refeita pelo modelo correspondente em tamanho real.
-
Compartilhamento de link
1200 × 630. Chão Algodão, a assinatura no alto à esquerda, o lema e a foto aprovada em coluna à direita.
-
Posts
1080 × 1350. Foto em cima e frase no Algodão; frase curta na pasta; número com o exemplo oficial e a ressalva.
-
Story
1080 × 1920, com 250 px livres no topo e 340 px na base.
-
Papel timbrado
A4. Duas versões: digital, com o chão Algodão, e de impressão, sem fundo, só cabeçalho e pé. Os dados do escritório entram quando confirmados.
-
Capa de apresentação
1920 × 1080: capa com a assinatura, o título e a foto; capítulo na pasta Capa. Há versão só com o fundo para o Google Slides e o PowerPoint.
-
Assinatura de e-mail final
HTML em tabela, em Georgia, com o PNG leve da assinatura sobre Algodão. A OAB entra quando for confirmada.
Pendências e créditos
O que falta do escritório para fechar os materiais. Até lá, nada é inventado: o que não existe aparece como “a confirmar”.
Números de OAB
Do Caio e do Esthevan, para o site, os documentos, o cartão e a assinatura de e-mail. Até chegarem, os materiais dizem “OAB nº a confirmar”.
CNPJ
Ainda não foi criado. Nenhum material traz número de CNPJ, endereço ou telefone inventado.
Sessão de fotos no escritório
Luz natural, conversa e mesa. Substitui as fotos de evento e completa a marca; até lá, só as três fotos retocadas.
Também a confirmar: cidade, WhatsApp, e-mail, endereço e o perfil do Instagram; as respostas das perguntas frequentes; se a área do cliente vai existir e em qual plataforma.
Créditos
Identidade por Anúncio Jurídico, outubro de 2026.
Sistema de marca desenvolvido pela Anúncio Jurídico para a Almeida Nascimento Advocacia: plataforma, símbolo, logo, cores, letra, 37 componentes e as aplicações deste manual.