Sobre este manual
Padrão, não sugestão.
Tudo o que está aqui é o jeito Zelo de se apresentar — em palavras, cores e cuidado. Seguir o manual é o que mantém a marca reconhecível e confiável em cada ponto de contato, do app ao relatório de fiscalização. Na dúvida, o princípio é sempre o mesmo: clareza, cuidado e calma. Se uma escolha deixa o usuário mais tranquilo e mais informado, ela está certa.
01 — Essência da marca
Cuidado é o produto. Tudo o resto é detalhe.
Zelo significa cuidado, diligência, atenção. A marca existe para transformar conformidade — algo que costuma assustar — em um estado contínuo e tranquilo.
Posicionamento
O sistema operacional da qualidade alimentar. O consultor define o padrão, a equipe opera a rotina, e uma IA que entende a legislação brasileira mantém os dois em conformidade.
Propósito
Existir para que a segurança alimentar seja um cuidado diário — não uma corrida contra a fiscalização.
Promessa
Você sempre sabe onde está — e o que falta para ficar no verde.
Confiável
Falamos com base na norma. Quando dizemos que está certo, está.
Direta
Sem rodeio, sem jargão. O próximo passo está sempre claro.
Premium
Cuidado no detalhe. Ferramenta séria para um tema sério.
Estruturada
Tudo tem método, ordem e rastro. Nada solto.
Tranquilizadora
Tiramos o susto da conformidade. No lugar dele, controle.
A frase-conceito
Conformidade não precisa ser pânico. Pode ser rotina.
02 — Logotipo
Uma palavra. Um ponto.
O logotipo é a palavra zelo em minúsculas, fechada por um ponto. O ponto não é pontuação — é o ponto de conformidade, o mesmo sinal de "tudo certo" que aparece em todo o produto.
Sempre minúsculas
O nome nunca é capitalizado. Minúsculo é mais próximo, mais calmo.
Onest Extrabold
Peso 800, com leve aperto entre letras (−5% de tracking).
O ponto é sagrado
Sempre na cor de conformidade. Nunca remova, nunca recolora.
Área de proteção
Reserve, em volta do logotipo, no mínimo a altura de um ponto de conformidade. Esse é o respiro mínimo — quanto mais, melhor.
Tamanho mínimo
Logotipo: 96 px · 24 mm. Símbolo isolado (o ponto): 24 px · 8 mm.
Símbolo isolado
Sem espaço para o nome, o ponto representa a marca sozinho — em avatares, favicons e o ícone do app: quadrado de cantos suaves verde pinho, círculo menta e check branco.
Variações aprovadas
- Principal — sobre fundo claro.
- Negativa — sobre fundo escuro ou foto.
- Monocromática — cor única, sem destaque no ponto.
Usos proibidos
- Distorcer as proporções.
- Recolorir ou remover o ponto.
- Trocar a tipografia.
- Aplicar sombra, contorno ou girar.
03 — Sistema de cores
O verde é significado, não enfeite.
No Zelo, verde é o estado de quem está em conformidade. Use a cor para informar — não só para decorar. Cada tom tem uma função; respeitar essa função é o que torna a interface legível à primeira batida de olho.
Cores de status — cada cor tem um trabalho
Neutros
Proporção de uso
A base é neutra e clara — o produto respira. O verde estrutura. Status e destaque entram em pequenas doses, só onde há informação a comunicar.
O trabalho do Zelo, contado em cor: levar cada estabelecimento do vermelho ao verde — e mantê-lo lá.
04 — Tipografia
Uma só família: Onest.
Geométrica o suficiente para parecer sistema, humana o suficiente para parecer gente. Pesos de 300 a 900 cobrem do dado fino ao título firme — sem nunca precisar de outra fonte.
Faça
- Títulos em 800; corpo em 400 com entrelinha 1.5–1.65.
- Números sempre tabulares em dados.
- Aperto de tracking só em títulos grandes.
Evite
- Outra família tipográfica, em qualquer contexto.
- Peso 900 em texto corrido.
- Esticar, condensar ou caixa-alta em frases longas.
05 — Iconografia & ilustração
Linha leve, ponto cheio.
Os ícones são desenhados em linha — abertos e calmos. O único elemento sempre preenchido é o ponto de conformidade: a assinatura gráfica que costura produto, marca e materiais.
Traço 1,75 px
Espessura única em toda a família, num grid de 24 px.
Cantos suaves
Pontas e junções arredondadas, raio 2 px. Nada anguloso.
Linha aberta
Sem preenchimento. Os ícones respiram como o resto da marca.
O ponto é cheio
A única exceção: o ponto de conformidade é sempre sólido.
06 — Direção de imagem
Cozinhas reais. Pessoas reais.
A imagem mostra o trabalho com respeito — luz natural, ambiente limpo e em operação. Nunca banco de imagem genérico, nunca cozinha de revista vazia. Quem usa o Zelo se reconhece nas fotos. Texto sobre imagem usa proteção verde-pinho — nunca texto solto.
Busque
- Equipes reais, em ação, no próprio ambiente.
- Luz natural e cor fiel — sem filtros pesados.
- Enquadramento próximo: mãos, detalhe, gesto.
- Ambiente limpo e organizado, mas vivo.
Evite
- Sorriso e pose de banco de imagem.
- Cozinha de revista, estéril e vazia.
- Jaleco impecável demais, encenado.
- Saturação alta, HDR, vinheta forte.
07 — Voz e tom
Direto, claro, tranquilizador.
O Zelo fala como um consultor que você confia: sabe a norma de cor, mas explica em português do dia a dia. Sem jargão jogado, sem susto — sempre com o próximo passo à vista.
Claro antes de completo
O essencial primeiro. O detalhe vem depois, se for preciso.
Próximo passo à vista
Toda mensagem aponta o que fazer agora.
Calma, mesmo no alerta
Informa o risco sem assustar. Urgência não é pânico.
Norma traduzida
Cita a lei, mas explica o que ela significa na prática.
Rotina
Leve e encorajador. Celebra o que está certo.
"Boa! Mais um dia no verde."
Risco
Firme e claro, sem alarde. Aponta a ação.
"Temperatura acima do limite. Ajuste e registre agora."
Fiscalização
Preciso e formal. Fatos, datas e referências.
"Plano atualizado em 12/06, conforme RDC 216."
08 — Mensagens-chave
O que dizemos, sempre.
Uma tagline que carrega o produto e a marca ao mesmo tempo: verde é estar em conformidade. As frases de apoio e os pitches puxam dela, nunca contra ela.
Assina peças, fecha apresentações, vive ao lado do logotipo. Curta o bastante para virar bordão.
Frases de apoio
- A qualidade como rotina, não como pânico.
- Sempre pronto para a fiscalização.
- Do plano à fiscalização, num só lugar.
- O cuidado que não dorme.
Pitch de uma linha
O Zelo mantém seu estabelecimento sempre no verde.
Pitch curto
O Zelo é o sistema operacional da qualidade alimentar: o consultor define o padrão, a equipe opera a rotina e uma IA que entende a legislação brasileira mantém tudo em conformidade — todo dia, sem susto.
09 — Aplicações
A marca onde o trabalho acontece.
Do app à fiscalização, o sistema se mantém: verde para conformidade, ponto como assinatura, Onest em tudo. Coerência é o que constrói confiança.
No produto
App e painel: índice "no verde", checklist diário, alertas de risco com cor + ícone + rótulo.
Redes & papelaria
Posts 1080×1080, cartão de visita (frente verde, verso branco com o ponto), capas com a malha de pontos.
E-mail & relatório
Assinatura de e-mail com a tagline; relatório de conformidade "Gerado pelo Zelo", com referência à RDC.
Ícone do app & favicon
O ponto de conformidade isolado: quadrado verde pinho, círculo menta, check branco. App 1024, touch e favicon.
Assinatura de e-mail
Nome · cargo · zelo. — e a linha "No verde, todo dia." em verde conformidade.
Evolução em relatório
Barras do cinza ao verde profundo contando a melhora — o caminho do estabelecimento até o verde.
10 — Acessibilidade
Legível para todos, sempre.
Num produto de segurança, ninguém pode ficar de fora da informação. Contraste suficiente, texto generoso e status que nunca dependem só da cor.
Tinta / Canvas
14,6:1 · AAA
Branco / Verde pinho
7,9:1 · AAA
Branco / Verde profundo
11,1:1 · AAA
Tinta / Verde destaque
8,9:1 · AAA
Branco / Conformidade
3,6:1 · AA Grande
Tinta / Atenção
6,0:1 · AA
16 px
Corpo mínimo para leitura, com entrelinha ≥ 1,5.
44 px
Alvo de toque mínimo em botões e itens tocáveis.
4,5:1
Contraste mínimo (AA); buscamos AAA sempre que possível.
Cor + ícone + rótulo
Status nunca dependem só da cor — o ícone e o rótulo carregam o significado sozinhos.
11 — Design System do app
Vidro sobre verde.
O sistema da marca vira produto: fundo verde vivo, vidro fosco por cima, conteúdo neutro e calmo — premium, tranquilo e legível à primeira batida de olho. Esta seção estende o manual; a identidade é a mesma, agora em tela.
A camada de vidro
A assinatura do app: translúcido, com brilho no topo e sombra suave. Só funciona sobre o verde — é o fundo que ele refrata.
--glassrgba(255,255,255,.53)--glass-2rgba(255,255,255,.40)--glass-bdrgba(255,255,255,.70)--glass-hirgba(255,255,255,.95)--blursaturate(172%) blur(21px)raio · cartão16–18 pxTelas-modelo — o sistema em uso
A carteira inteira num olhar — quem está no verde e quem precisa de atenção.
O estabelecimento se enxerga: onde está forte, onde falha e para onde caminha.
Ficha técnica, custo/CMV e rótulo ANVISA — recalculando ao vivo, por cliente.
Cada cliente tem sua página: índice, categorias, documentos e focos de atenção.
Faça
- Fundo verde sempre atrás do vidro — é o que ele refrata.
- Status com cor + ícone + rótulo, nunca só cor.
- Números sempre tabulares em dados e painéis.
- Curvas de gráfico suaves, com pontos circulares.
- Cartão branco sólido só para "papéis": rótulo e documento.
Evite
- Vidro sobre fundo branco chapado — o efeito some.
- Amarelo de atenção com texto branco.
- preserveAspectRatio="none" em SVG — distorce.
- Rolagem horizontal e peso 900 em texto corrido.
- Recolorir o ponto de conformidade.