Brandbook + Design System
Tudo o que faz uma peça parecer hRaifa: quem a marca é, como fala, que imagem pode usar, o que o João já vetou, e as cores, tipos, componentes e modelos prontos pra produzir sem errar.

Parte I
Quem a hRaifa é antes de qualquer pixel. O que é fato vem marcado com a fonte; o que é proposta da Arte One está sinalizado para validar com o João.
01 · Essênciaplataforma de marca
A frase da capa é a que o João manteve no card de 26 anos. O eixo de conteúdo veio dele na série DUIMP. O resto organiza o que os pedidos dele vêm dizendo desde junho.
Conectando países e gerando negócios.Assinatura mantida pelo João no card de aniversário · grupo MKT HRAIFA, 21/08/2026
Eixo de conteúdo
O foco é o processo inteiro, decidido antes. Nunca “esperar a carga chegar”.
Fato · João no grupo MKT, 27/08/2026Quem é
Fundada em 2000, em Curitiba. Desembaraço aduaneiro, importação e exportação de mercadorias e máquinas, seguro internacional, logística integrada e consultoria em projetos especiais, nos modais aéreo, marítimo e rodoviário.
Fato · site hraifa.com.br, lido em 09/10/2026Promessa e público
Quem importa com a hRaifa decide antes e com informação certa, sem surpresa no porto. Fala com empresas que importam e exportam e precisam de segurança técnica no processo aduaneiro.
Proposta · validar com o JoãoPilares de conteúdo
Risco real com o que fazer agora. Ele citou o caso do Grupo Dolly como exemplo (06/07).
Catálogo, documentos, exigências: o que conferir antes do registro (27/08).
Notícia urgente publicada no dia, com imagem fiel ao risco, como o tufão (27/08).
Série sobre a transição: hora de se adequar, sem deixar pra última hora (16 e 17/07).
Institucional curto e datas, com a assinatura e pouco texto (21/08, 09/10).
02 · Personalidadecomo a marca se comporta
Quatro traços para decidir rápido se uma peça, uma imagem ou uma legenda está no tom. Cada um nasce de um pedido ou de um veto do João.
Nomeia o órgão, o documento e a data
Número sem fonte, certeza que não existe
Diz o que conferir e quando
Institucional genérico, e-book, isca
Imagem que existe de verdade num porto
Cena bonita que nenhum operador faria
Layout clean, luz de dia, pouco texto
Alarde, drama, tom emocional
03 · Voztexto na arte e na legenda
O João pediu conteúdo “mais voltado à prática” e reclama de texto repetido e com cara de IA. A regra é simples: frase curta, fato com fonte, e a legenda publicada é sempre a que ele aprovou.
Fato · grupo MKT 06/07/2026 e áudio de 29/09/2026Na arte
Título curto em duas ou três linhas e uma linha de apoio. O resto vai pra legenda, com a pílula “Leia a legenda”. Na linha clara, o título nunca invade a imagem.
Na legenda
O que mudou, o que o importador faz agora e de onde veio a informação, com data de consulta. Previsão é escrita como previsão. Sem nota interna, sem data vencida.
No grupo
Peça com legenda junto e uma pergunta só. Lembrete raro e gentil, do tipo “quando tiver um tempinho”. Conteúdo técnico só vai ao ar com o aprovado dele.
Dizemos
Evitamos
Anatomia da legenda
04 · Imagemestilo e direção
Quase todo veto do João foi de imagem: cena de noite, pallets errados, imagem que não casa com o texto, algo que lembra ilicitude e carga solta no navio. Quem conhece porto vê o erro na hora. Daí vem a regra número um: a cena é fiel à operação real.
Fato · grupo MKT 07/07, 15/07, 14/09 e áudio de 29/09/2026





Todas as imagens da hRaifa hoje são ilustrativas: geradas por IA para as pautas de set/26 ou de banco (site). Não há foto própria da operação na pasta do cliente.
Três famílias de imagem

Porto, navio, caminhão, avião. Sempre de dia, com a carga estivada e amarrada como numa operação de verdade.

Mesa, checklist, DUIMP, catálogo. O documento da pauta aparece na cena, e o texto dele não precisa ser lido.

Conferência, análise, armazém. EPI e uniforme corretos, gente trabalhando, nunca pose de banco de imagem.
Regras duras de imagem (vêm dos vetos)
Amanhecer ou dia claro. Nunca penumbra ou noite: ele recusou quatro artes por isso.
João · MKT, 07/07/2026Pallets corretos no contêiner, carga amarrada no navio, nada solto por cima. Mesmo em animação.
João · MKT 15/07 e áudio 29/09A cena mostra o que o título diz. Ele pediu “container no navio com tarja LIBERADO e logo RF”.
João · MKT, 15/07 e 14/09Papel queimando, fuga, improviso: qualquer coisa que soe ilegal. A marca transmite o contrário.
João · MKT, 15/07/2026Alerta mostra o risco real: no tufão, mapa da China nas cores da bandeira e o redemoinho na rota.
João · MKT, 27/08/2026Pauta técnica pede cena de comércio exterior, não escritório genérico. Sem imagem repetida.
Paulo · Internos, 16/07 e 24/07Tratamento de cor



Uma imagem, três recortes



Checklist antes de gerar ou escolher a imagem
Imagem de banco usada no site hraifa.com.br: navio de dia, carga estivada. É o nível de realismo que a peça precisa ter.
Evitar
Inclusive pôr do sol escuro. João, 07/07
Nem em vídeo lúdico. João, 29/09
Vetada duas vezes pelo mesmo motivo. João, 15/07 e 14/09
Papel queimando, fuga, improviso. João, 15/07
Riscos coloridos soltos na arte. João, 16/07
Na linha clara, o texto fica no bloco branco. Paulo, 11/09
Ou com texto ilegível na cena. Paulo, 16/07
Pauta técnica pede COMEX. Paulo, 24/07
05 · Aplicaçõesa marca fora do post
Onde a identidade aparece além do feed: o perfil do Instagram, as figurinhas de WhatsApp, o site e o vídeo da ponte estaiada.
Perfil do Instagram

@hraifa_logistica: 1.561 seguidores e 259 posts em 11/09/2026.



Vídeo 3D · Ponte estaiada da Av. das Torres
Personagem aprovado pelo Paulo e pelo Vilson em 24/09 (rosto direto no mastro vermelho). O que ainda pede ajuste é a cena do navio: a carga tem que estar amarrada, como num transporte real. Daqui pra frente o roteiro de vídeo passa pelo Vilson e pelo Paulo antes de produzir.
Fato · áudios de 29/09/2026 (João e Vilson)Parte II
As peças da marca, com nome, medida e regra de uso, prontas para virar arte, template ou código. Medidas em pixels no canvas de 1080 de largura, tiradas do template nativo do Illustrator.
06 · Corescalas e papéis
Quatro escalas de dez passos geradas em OKLab a partir dos hex reais da logo e do template. O passo com contorno é a cor da marca; os outros servem para fundo, borda e sombra sem inventar cor nova.
| bg.canvas | #FFFFFF |
| bg.pattern | #FAFAFA |
| text.primary | #002972 |
| text.muted | #4D4D4D |
| brand | #002972 |
| accent | #D80000 |
| pill.site.border | #002972 |
| stripe | #D80000 |
| bg.photo.veil | #000739 |
| text.primary | #FFFFFF |
| text.muted | #E7E7E7 |
| accent | #D80000 |
| pill.site.bg | #D80000 |
| pill.site.text | #FFFFFF |
| pill.cta.bg | #FFFFFF |
Proporção numa peça clara: 62 branco · 10 prata · 20 marinho · 6 vermelho · 2 grafite. Hex amostrados com PIL da logo oficial (#002972, #D80000, #C1C1C1) e do fundo do template (#4D4D4D na frase do topo).
07 · Tipografiaduas famílias
O template nativo usa Montserrat Black nos títulos da linha clara, Montserrat Regular no apoio e Gotham Bold nos títulos da linha escura. Gotham é paga e a cópia extraída do .ai está incompleta (faltam K, Q, W e Y). Nesta prancha a Gotham aparece como Montserrat 800, que é a aproximação mais próxima disponível no Google Fonts.
Fato · “Hraifa - Novo Template.ai” e produção de 12/09/2026ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
Montserrat · 300, 400, 700, 900
Título da linha clara (900), apoio (400), rótulos (700) e frase do topo (300).
ABCDEFGHIJKLMNOPQRSTUVWXYZ
0123456789
Gotham Bold · aqui Montserrat 800
Título em caixa alta da linha escura. Na produção, usar a Gotham completa da Arte One.
Título e apoio medidos no renderizador do template (render_art.py). Rótulo, CTA e fonte medidos nas artes de set e out/26. Amostras ao lado em escala reduzida.
08 · Logowordmark + globo com seta
O Paulo pediu a logo original em 11/09 e o selo de 25 anos saiu de todos os cards em 14/09. Em 2026 a hRaifa completa 26 anos (23/08, data do contrato social). Use só os dois arquivos abaixo.
Fato · Trello hRaifa 11/09 e grupo MKT 10/08/2026
Colorida sobre branco · padrão

Colorida sobre prata · fundo do template

Branca sobre marinho ou foto com véu

Área de proteção = altura do “h” (X) em volta de toda a logo.
Claro · 220 pxà esquerda, no topo
Escuro · 245 pxcentralizada, no topo





Pasta do cliente no Drive: “Logo_Oficial_hRaifa_Oficial.png” (colorida) e “Redes Sociais / 2026-09-12 - Logo sem aniversario / Logo-branca-sem-aniversario.png” (branca). O arquivo “Logo_Oficial_hRaifa_25_Anos.png” fica só como histórico.
09 · Grid e formatosmargens e zona segura
No claro, a imagem ocupa a faixa de 175 a 1035 px com fade nas bordas, e o texto vem centralizado embaixo, com margem de 65. No escuro, a foto é inteira com véu e o texto alinha à esquerda na margem de 105. No story, 250 px no topo e na base ficam livres para a interface do Instagram (recomendação da Meta: 14%).
10 · Componentesblocos que montam as peças
Cada bloco tem nome, tamanho e fundo certo, tirados do template aprovado. Montar uma arte é escolher blocos, não desenhar do zero.

Do local ao global,Logística internacional tem nome

11 · Peçasmodelos montados com os componentes
Montados em HTML na medida real, sobre o fundo nativo do template, e reduzidos para caber na tela. Texto entre colchetes é para trocar; o resto segue a regra. As imagens são ilustrativas (IA).

Feed · Pauta · linha claraImagem na faixa central com fade, título em caixa alta, apoio e site. Base: H01 “A importação começa antes da carga sair” (set/26).
Story · Pauta · linha escuraFoto de dia, véu marinho, título à esquerda. Topo e base respeitam os 250 px livres. Base: modelo escuro de jul/26.
Feed · Pauta · linha escuraAlterna com a linha clara. Foto inteira de dia, véu, título e pílula. Base: H08 “Frete aéreo: o tempo é decisivo” (set/26).
Story · Data comemorativaPouco texto, assinatura da marca, imagem de dia. Base: Dia das Crianças, aprovado pelo João em 09/10.
Carrossel · Guia de operação · 3 slidesSem foto: o conteúdo é a informação oficial, com fonte e data. Abertura, etapas e checklist com convite. Base: DUIMP “o que já funciona” (08/10).
Peças reais de referência
Aprovada pelo João · 09/10Dia das Crianças · story
Aprovação interna · 08/10DUIMP · guia 1/3
Aprovação interna · 08/10DUIMP · guia 2/3
Em produção · 14/09Linha clara · sem selo
Em produção · 14/09Linha escura · sem selo
Novo template · jun/26Layout clean12 · Legibilidademedida, não estimada
Contraste calculado pela fórmula WCAG 2.2 com os hex reais. A peça é vista num celular de cerca de 390 px de largura, então todo tamanho do canvas de 1080 cai a 36%.
| Amostra | Contraste | Nível | Uso |
|---|---|---|---|
| hRaifa 25 | 13.46:1 | AAA | Título na linha clara |
| hRaifa 25 | 8.45:1 | AAA | Texto de apoio na linha clara |
| hRaifa 25 | 12.90:1 | AAA | Título sobre o fundo do template |
| hRaifa 25 | 13.46:1 | AAA | Texto branco sobre marinho |
| hRaifa 25 | 5.36:1 | AA | Site na pílula vermelha |
| hRaifa 25 | 5.36:1 | AA | Rótulo vermelho no claro |
| hRaifa 25 | 19.28:1 | AAA | Título na linha escura (véu) |
| hRaifa 25 | 2.51:1 | Reprova | Vermelho sobre marinho (evitar) |
Tamanho mínimo
| Linha de fonte | 18 px → 6,5 no celular |
| Apoio na linha clara | 30 px → 10,8 |
| Apoio na linha escura | 36 px → 13 |
| Título | 55 px → 20 |
A linha de fonte é pra quem quer conferir, não pra leitura corrida. Tudo que a pessoa precisa ler fica de 30 px pra cima.
Regras
13 · Tokenspara template e código
Use no gerador de posts, no site ou no Figma. Nomes iguais aos desta prancha.
{
"color": {
"marinho": {
"50": "#F1FBFF",
"100": "#D1DFF6",
"200": "#B2C4E2",
"300": "#94A9CE",
"400": "#768FBA",
"500": "#5976A7",
"600": "#3D5D94",
"700": "#214482",
"800": "#002972",
"900": "#000739"
},
"vermelho": {
"50": "#FFF1EA",
"100": "#FFD3C9",
"200": "#FFB4A8",
"300": "#F79687",
"400": "#EC7565",
"500": "#E15041",
"600": "#D80000",
"700": "#A20000",
"800": "#6E0000",
"900": "#3D0000"
},
"prata": {
"50": "#FAFAFA",
"100": "#E7E7E7",
"200": "#D4D4D4",
"300": "#C1C1C1",
"400": "#A09F9E",
"500": "#807F7D",
"600": "#62605D",
"700": "#45433F",
"800": "#2A2823",
"900": "#110F09"
},
"grafite": {
"50": "#FAFAFA",
"100": "#DFDFDF",
"200": "#C5C5C5",
"300": "#ACACAC",
"400": "#939393",
"500": "#7B7B7B",
"600": "#636363",
"700": "#4D4D4D",
"800": "#2E2C29",
"900": "#110F09"
}
},
"semantic": {
"claro": {
"bg.canvas": "#FFFFFF",
"bg.pattern": "#FAFAFA",
"text.primary": "#002972",
"text.muted": "#4D4D4D",
"brand": "#002972",
"accent": "#D80000",
"pill.site.border": "#002972",
"stripe": "#D80000"
},
"escuro": {
"bg.photo.veil": "#000739",
"text.primary": "#FFFFFF",
"text.muted": "#E7E7E7",
"accent": "#D80000",
"pill.site.bg": "#D80000",
"pill.site.text": "#FFFFFF",
"pill.cta.bg": "#FFFFFF"
}
},
"type": {
"family.sans": "Montserrat",
"family.display": "Gotham Bold (na prancha: Montserrat 800)",
"title.light": "64/70 Montserrat 900 caps centro",
"title.dark": "55/60 Gotham Bold caps esquerda",
"title.guide": "60/1.05 Montserrat 800",
"kicker": "30/1.2 Montserrat 300 caps",
"body.light": "30/35 Montserrat 400",
"body.dark": "36/40 Montserrat 400",
"label": "20/1 Montserrat 700 +0.16em caps",
"cta": "18/1 Montserrat 600 caps",
"legal": "18/1.3 Montserrat 400"
},
"layout": {
"canvas.width": 1080,
"margin.light": 65,
"margin.dark": 105,
"story.safe": 250,
"columns": 6,
"logo.light.width": 220,
"logo.dark.width": 245,
"photo.light.top": 175,
"photo.light.height": 860,
"stripe.height": 43,
"radius.pill": 99
}
}
Baixar tokens.json
Parte III
O que a equipe precisa saber do cliente antes de produzir. Uso interno da Arte One.
14 · Na ponta da línguaatualizado em 09/10/2026
Pauta prática, imagem fiel, texto aprovado.Foco atual · 09/10/2026 · guia da DUIMP em aprovação interna e novos modelos de arte esperando as referências do Vilson
Quem decide
João R Gritzenco aprova tudo no grupo “MKT HRAIFA | ArteOne”. Conteúdo técnico só vai ao ar com o aprovado dele.
O que ele pede
Publicação toda semana (15/07), tema novo em vez de repetido (14/09) e números de acesso ao site e de visualização do Instagram (06/07).
Onde fica
Rua Padre Anchieta 2050, conj. 2505 · Bigorrilho, Curitiba/PR · (41) 3224-4425
15 · Pessoas e canais
Decide e aprova. Grupo MKT HRAIFA.
Conversa com o João, define pauta e verba.
Revisa e libera na Aprovação Interna do Trello.
Leva peças ao grupo do cliente.
@hraifa_logistica · hraifa.com.br · hraifa@hraifa.com.br
Google Ads (conta recebida em 27/08). Sem conta no Meta Ads.
Links
Acessos e credenciais ficam só no dossiê interno do Drive: “DOSSIE - hRaifa.md”.
16 · Pendênciasdono e próxima ação
Vilson · passar os links e as referências do que o João pediu (pedido em 09/10). A produção começa por eles, já seguindo esta prancha.
Paulo e Vilson · liberar na Aprovação Interna; depois vai ao João. Se sair depois de 13/10, reconferir as datas no Siscomex.
Vilson · decidir se seguem. Antes de reenviar: atualizar a data citada na Reforma 3 e usar na DUIMP o texto aprovado em 27/08.
João valida a lista (disse em 21/09 que via na volta da viagem). Vilson fecha a verba para a campanha subir.
Vilson · combinar com o João se a cena do navio é refeita com a carga amarrada. Roteiro passa por Vilson e Paulo antes.
Vilson e Paulo · escolher quais seguem e com que texto. Várias pautas de serviço já saíram antes; vale levar a lista pro João escolher.
17 · Histórico
Fundação da hRaifa em Curitiba. Aniversário em 23/08, data do contrato social.
João aprova o layout novo, “melhor e mais clean”.
Pede amanhecer no fundo, não penumbra de noite.
Regras de imagem e de texto: nada de ilicitude, pallets corretos, DARF atual, IBS e CBS como tendência.
Card de 26 anos aprovado com “Conectando países e gerando negócios”.
Reforma tributária 1, 2 e 4 e o post urgente do tufão aprovados. Eixo da DUIMP: antecipação. Conta Google recebida.
Lista de palavras-chave do Google enviada ao João.
Importação de máquinas sai de pauta (“já publicado outras vezes”). Selo de 25 anos sai de todos os cards.
Quatro artes e 17 figurinhas de WhatsApp enviadas ao grupo.
Vídeo da ponte estaiada enviado ao João.
João pede conversa com Vilson e Paulo sobre textos e o vídeo. Alinhamento interno com a lista de vetos.
Conversa do Vilson com o João, combinada em 29/09.
João pede post novo: o que já funciona na DUIMP e o que falta.
Guia DUIMP produzido com fonte oficial do Siscomex e enviado à aprovação interna.
João aprova o story do Dia das Crianças. Vilson traz o pedido de novos modelos de arte. Brandbook e design system v1.0.
Fontes conferidas em 09/10: grupo MKT HRAIFA e ArteOne | Internos (Evolution), Trello (quadro gDny6SYT), ClickUp, site hraifa.com.br, memória da frente Arte One e pasta do cliente no Drive.