Brand Guidelines

O Intelecto Propõe.
O Humano Dispõe.

Agentis Pay é a infraestrutura de pagamentos para a era dos agentes de IA. Máquinas redigem intenção. Humanos autorizam com biometria. O dinheiro só sai com sua assinatura.

Versão 1.0 Março 2026 Confidencial
01 — Sistema de Logo

AgentisPay

O mascote é Hermes — deus grego do comércio, das trocas e da velocidade. Guardião de fronteiras entre mundos. O chapéu alado representa a agilidade dos agentes autônomos. O wordmark combina serif clássico em "Agentis" com sans moderno em "PAY" — tradição que liquida em milissegundos.

Agentispay logo principal

Versões do logo — fundos escuros

Logo dark orange Escuro · Orange PAY
Logo dark teal Escuro · Teal PAY
Logo inverted Escuro · Orange Agentis
Logo wordmark only Só wordmark

Versões — fundo laranja e teal

Logo orange bg Fundo laranja
Logo orange wordmark only Fundo laranja · Só wordmark
Logo teal bg Fundo teal
Logo teal wordmark only Fundo teal · Só wordmark

Versões — fundo claro

Logo light bg orange Fundo claro · Orange PAY
Logo light bg teal Fundo claro · Teal PAY

Ícone — mascote isolado

Mascot orange bg
Laranja
Mascot dark bg white
Escuro · Branco
Mascot dark bg orange
Escuro · Laranja
Mascot teal
Teal

Versões sem fundo — uso em qualquer contexto

Logo completo transparente dark Transparente · Completo · Escuro
Wordmark transparente dark Transparente · Wordmark · Escuro
Logo completo transparente claro Transparente · Completo · Claro
Wordmark transparente claro Transparente · Wordmark · Claro

Não faça isso

Não distorça Nunca estique ou comprima o logo horizontalmente ou verticalmente.
Não troque a cor Use apenas as combinações de cor aprovadas. Nunca aplique o logo em azul, verde ou outras cores.
Não use em gradientes Nunca aplique o logo sobre fundos gradientes ou fotográficos complexos.
Não use com baixo contraste Garanta sempre contraste mínimo para legibilidade do wordmark.

02 — Sistema de Cores

Paleta oficial

Agentis Orange
Cor primária de ação e destaque
#FF5500
RGB 255 · 85 · 0

Família laranja

Orange
#FF5500
CTAs, links, destaque primário
Orange Dark
#CC4400
Hover states, pressed
Orange Light
#FF9000
Alertas, avisos leves

Família teal (secundária)

Teal
#1A7A8A
Variante secundária do logo
Teal Dark
#0E6070
Hover teal, fundo teal

Backgrounds — modo escuro

BG 01
#0D1117
Fundo base do app
BG 02
#111D27
Cards, painéis
BG 03
#161F2A
Cards elevados
BG 04
#1C2733
Hover, active states
Border
#1E2D3D
Bordas, separadores

Backgrounds — modo claro

Cream
#EDE8DF
Fundo modo claro, quente
Cool Gray
#DCE6EA
Fundo modo claro, frio
White
#FFFFFF
Textos e ícones sobre escuro

Cores semânticas

Success
#34D399
Danger
#C03A2B
Warning
#FF9000
Info
#60A5FA

Tokens CSS

TokenCorHexUso
--orange#FF5500CTAs, links, destaque primário
--orange-dark#CC4400Hover e pressed states
--teal#1A7A8ACor secundária do logo
--bg#0D1117Fundo base
--bg2#111D27Cards e painéis
--serifPhilosopherGoogle FontsH1 de marca, hero, splash, manifesto
--t#FFFFFFTexto primário
--t2#8A9BB0Texto secundário
--success#34D399Confirmado, aprovado
--danger#C03A2BErro, recusado, destrutivo

03 — Tipografia

Três famílias tipográficas

Cada família tem um papel preciso. Philosopher carrega a personalidade da marca. Space Grotesk sustenta a interface. Space Mono ancora os dados.

Personalidade
Philosopher — logo, H1 de destaque, momentos de marca
O Intelecto Propõe.
O Humano Dispõe.
A autoridade de gasto não pode ser delegada a uma credencial estática.
Regular 400
Corpo display, títulos longos
Bold 700
Headlines, logo, destaque
Itálico
Ênfase, taglines, citações
Bold Itálico
Máxima ênfase
Use Philosopher em hero H1, onboarding, splashes, confirmação de pagamento e seções de manifesto. Nunca em labels, botões, inputs ou textos funcionais — esses são sempre Space Grotesk.
Interface
Space Grotesk — interface, botões, corpo, subtítulos
Sua IA paga.
Você aprova.
Dê poder de compra ao seu agente. O controle final permanece no enclave seguro do seu smartphone.
Light 300 Regular 400 Medium 500 SemiBold 600 Bold 700
Dados
Space Mono — valores, saldos, tokens, timestamps, código
R$ 1.450,00
0123456789 · PIX · 2026-03-11T14:23:05Z
agentispay_pay · req_01JAGENTIS8Z · claude-opus-4

Escala tipográfica completa

NomeFamíliaTamanhoPesoUsoPreview
DisplayPhilosopher72–88px700Hero de marca, splashPropõe.
H1 SerifPhilosopher48–64px700Onboarding, confirmação, manifestoO Humano Dispõe.
H1Space Grotesk52px700Títulos de páginaAgentis Pay
H2Space Grotesk36px700Títulos de seçãoComponentes
H3Space Grotesk24px700Títulos de cardCard title
Body LSpace Grotesk18px400Texto longo, marketingTexto principal
BodySpace Grotesk16px400Interface padrãoTexto padrão
Body SSpace Grotesk14px400Secundário, metadadosTexto menor
CaptionSpace Grotesk12px500Labels, helper textCaption text
MicroSpace Grotesk11px700Section labels, badgesLABEL
Mono LSpace Mono24px+700Valores, saldosR$200
MonoSpace Mono13px400Tokens, timestamps, código--token

04 — Voz & Tom

Como a Agentis Pay fala

A voz é filosófica, declarativa e precisa. Mescla referências clássicas com linguagem técnica sem jamais ser casual ou excessiva. Cada frase carrega peso. Sem exclamações. Sem rodeios. Sem amigabilidade forçada.

01
Filosófico
Eleva o discurso. Usa conceitos como "soberano", "consentimento", "vontade". Não é um app de pagamento — é infraestrutura para a era da IA.
02
Declarativo
Frases curtas e definitivas. "O dinheiro só sai com sua biometria." Sem condicionais desnecessários. A marca sabe o que é.
03
Técnico
Usa terminologia real: "trilho de liquidação", "consentimento biométrico", "ledger", "proposta". Respeita a inteligência de quem integra.
04
Clássico
Referências à Ágora grega, a Hermes, ao soberano. Posiciona tecnologia de ponta em linguagem duradoura.
05
Binário
Contraste como estrutura: máquina propõe / humano dispõe. O jeito antigo / o jeito Ágora. Sempre dois lados, sempre claro.

Vocabulário da marca

UseEvitePor quê
PropostaSolicitação / pedidoO agente propõe — o humano decide. Hierarquia clara.
O soberano dispõeO usuário aprovaReforça a autoridade humana como princípio, não feature.
Consentimento biométricoConfirmação / autenticaçãoBiometria é prova criptográfica de vontade humana.
Trilho de liquidaçãoMétodo de pagamentoPIX é um trilho — a linguagem técnica é intencional.
A ÁgoraA plataforma / o produtoA Ágora é o jardim de infraestrutura, não um SaaS qualquer.
BipaApp / aplicativoBipa é o nome próprio do app de aprovação biométrica.
Loop agênticoAutomação / botPrecisão técnica. Agentes têm loops, não são bots.

Exemplos de tom

Aprovação — Use
"Proposta liquidada. R$ 200,00 para João Silva."
Aprovação — Evite
"Seu pagamento foi processado com sucesso pelo sistema!"
Erro — Use
"Limite da política excedido. Ajuste em Configurações → Políticas."
Erro — Evite
"Ops! Ocorreu um erro inesperado. Tente novamente mais tarde."
Agente — Use
"claude-opus-4 propôs R$ 200,00 para João Silva. Aguardando biometria."
Agente — Evite
"O seu agente de inteligência artificial deseja efetuar uma transferência..."
Estado vazio — Use
"Nenhuma proposta pendente."
Estado vazio — Evite
"Você não possui nenhum pagamento aguardando aprovação no momento."
Marketing — Use
"O dinheiro só sai com sua biometria."
Marketing — Evite
"Controle total sobre os pagamentos do seu agente de IA!"

Taglines

03O dinheiro só sai com sua biometria.
04Sem sua aprovação, nada acontece.
05A autoridade de gasto não pode ser delegada a uma credencial.

05 — Ilustrações

Estilo dot-matrix

As ilustrações da Agentis Pay são renderizadas em dot-matrix — formas construídas com matrizes densas de pontos e vírgulas, criando volume e textura sem linhas sólidas. O resultado é técnico, orgânico e inconfundível. Fundo sempre preto. Variações em laranja --orange e branco.

Símbolo abstrato — Agentis

Losango de quatro pétalas. Remete ao símbolo PIX e à interseção entre agente e humano.

Símbolo Agentis laranja
Laranja · #FF5500
Símbolo Agentis branco
Branco · #FFFFFF

Moeda — ícone de pagamento

Representação abstrata de valor e liquidação. Usado em contextos de confirmação de pagamento e marketing.

Moeda laranja
Laranja · #FF5500
Moeda branco
Branco · #FFFFFF
Fundo sempre preto puro (#000) — nunca aplique em fundos coloridos, gradientes ou claros. As ilustrações são assets de destaque, não decoração de fundo. Use em seções hero, cartas de confirmação e materiais de marketing.
Mobile Design System

iOS & Android

390 × 844px · iPhone 15 · Space Grotesk · Dark mode

Design Tokens Mobile

Tokens extraídos diretamente do Figma. Usados como CSS custom properties em todos os componentes.

TokenCorHexUso
--c-base → --bg#0D1117Fundo do app
--c-card → --bg2#111D27Cards principais
--c-inner → --bg#0D1117Rows de dados internos
--c-elevated → --bg3#161F2AElevated, hover
--c-input → --bg3#161F2ACampos de input
--c-border → --border#1E2D3DBorda card destinatário
--c-border-subrgba(30,45,61,.6)Borda cards secundários
TokenCorHexUso
--c-t1 → --t#FFFFFFTexto primário
--c-t2 → --t2#8A9BB0Texto secundário
--c-t3 → --t3#4A6070Labels, subtexto
--c-t4 → --t3#4A6070Texto dimmed, info
--c-t5#2A3D4FPlaceholder, muted
--c-t6 → --border#1E2D3DSubtle, source labels
--c-orange → --orange#FF5500CTA primário, brand
8px — Inner rows
--r-inner
12px — Botões
--r-btn
14px — Cards info
--r-card
20px — Card principal
--r-card-lg

Amount Hero

Display principal de valor monetário. Hierarquia tipográfica precisa extraída do Figma.

Você aprovará
R$
200,00
Pix instantâneo
Amount Hero — Aprovação pendente
Label: 12px · --c-t5
Inteiro: 52px bold · --c-t1
Decimal: 26px regular · --c-t1
Símbolo: 24px regular · --c-t5
Saldo disponível
R$
3.450,00
Ativo
Amount Hero — Saldo
Mesma hierarquia · badge de status abaixo
Proposta liquidada
R$
200,00
PIX confirmado · 14:23
Amount Hero — Confirmado
Cor muda para --c-success em toda a hierarquia

Cards

Recipient Card, Info Cards e Approval Card — extraídos diretamente do Figma node 128:6247.

J
João Silva
joao@pix.com
✓ Válido
Chave PIX
joao@pix.com
CPF
•••.456.•••-78
Recipient Card
bg: --c-card (--bg2) · border: --c-border (--border) · radius: --r-card-lg (20px)
Avatar: 44px · gradient --bg3→--bg4 · Inner rows: --c-inner (--bg) radius 8px
Comando do Agente
"paga o João pelo almoço de hoje"
Claude Desktop
Agent Command Card
radius: 14px · border: rgba(255,255,255,.06)
Label: 10px bold --c-t2 · Text: 13px --c-t4
Janela de aprovação
Expira em 4:32 — após isso, cancelado automaticamente.
Expiry Card
Timer bold: --c-t3 · Text: --c-t4
Proposta pendente
Você aprovará
R$
200,00
Destinatário
João Silva
Trilho
PIX · joao@pix.com
Agente
claude-opus-4
Motivo
Créditos de computação
Janela de aprovação4:32
Approval Card — Completo
bg: --bg2 · border: --border · radius: 20px · Timer: --orange fill animado · Botões: 48px height · radius 12px

Botões

height: 48px · border-radius: 12px · font: Space Grotesk 17px 600 · tracking -0.015em

Primary
bg: --orange · color: white
Ghost
border: --border2
Danger
bg: --c-danger-bg · border-danger
Disabled
bg: --bg2 · color: --border2
Button Dock
Sempre ao fundo. pt: 20px · gap entre botões: 12px · Home indicator: 134×5px rounded · bg: --bg

Badges & Status

Pills de estado, badges de validação e tags de contexto.

Pendente
Pending
bg: --c-orange-bg · dot animado
Aprovado
Success
bg: --c-success-bg
Recusado
Danger
bg: --c-danger-bg
✓ Válido
Valid
bg: rgba(255,255,255,.06)
J
M
A
T
B
Avatar — Iniciais
gradient: 135° --bg3→--bg4 · sizes: 44px / 32px / 28px · border-radius 50%
Notificações push
Aprovação biométrica
Agente ativo
Toggle
44×26px · OFF: bg --bg4, knob --t3 · ON: bg --t, knob --bg
3 propostas aguardando
Ver
Pending Banner
bg: --c-orange-bg · border: --c-orange-brd · dot animado

Inputs & Formulários

Campos de texto, valor monetário e estados de validação.

Input padrão
bg: --c-input (--bg3) · border: --c-border-input (--border2)
radius: 14px · padding: 14px 16px · font: 16px
R$
Formato de chave PIX inválido
Input de valor + estado de erro
Amount: Mono 22px bold · prefix: Mono 18px --c-t5
Error: border --c-danger-brd · helper text --c-danger

Lista de Transações

Item de histórico com ícone contextual, descrição e valor formatado.

João Silva
claude-opus-4 · PIX · 14:23
+R$150,00
Fornecedor XYZ
gpt-4o · PIX · 11:05 · aguardando
R$420,00
Proposta bloqueada
Limite excedido · 09:30
R$3.000,00
Proposta expirada
Coworking Beta · sem resposta
R$800,00
Transaction List Item
height: auto · padding: 14px 0 · border-bottom: 1px --c-border · icon: 40×40px radius 12px
Name: 13px 600 · Meta: 11px --c-t4 · Amount: Space Mono 13px 700

Tela Referência — Confirmar Pix

Composição completa do Figma node 128:6247. Todos os componentes em contexto real.

9:41
Você aprovará
R$
200,00
Pix instantâneo
J
João Silva
joao@pix.com
✓ Válido
Chave PIX
joao@pix.com
CPF
•••.456.•••-78
Comando do Agente
"paga o João pelo almoço de hoje"
Claude Desktop
Expira em 4:32 — após isso, cancelado automaticamente.
Figma node 128:6247 · 390×852px
Web Design System

Web & Dashboard

Dark editorial · 1160px max · 12 col · Space Grotesk + Philosopher + Space Mono

01

Tokens & Grid

Variáveis semânticas mapeadas da paleta base — seguem a convenção shadcn/ui adaptada à identidade AgentisPay.

Tokens semânticos web
TokenValorUso
--background#0D1117Page background
--card#111D27Card surface
--popover#161F2ADropdown, tooltip bg
--primary#FF5500Brand orange — CTA principal
--primary-foreground#FFFFFFTexto sobre primary
--secondary#1C2733Botão secundário, bg4
--muted#161F2AFundo muted, bg3
--muted-foreground#8A9BB0Texto secundário, t2
--accent#1A7A8ATeal — ação secundária
--destructive#C03A2BDanger, erro, recusa
--border#1E2D3DBordas de containers
--input#263545Borda de input em foco
--ringrgba(255,85,0,.22)Focus ring — orange-border
--radius14pxBorder-radius base (card)
Grid & Breakpoints
BreakpointLarguraColunasGutterUso
sm< 640px416pxMobile
md640–1024px824pxTablet
lg1024–1280px1232pxDesktop
xl> 1280px1248pxDashboard wide
Escala tipográfica
Herói
Philosopher 48px/700 · hero, landing
Título de página
Space Grotesk 32px/700
Seção & Card header
Space Grotesk 22px/700
Corpo de texto padrão, descrições e labels longos com mais contexto.
16px/500
Texto de suporte, meta, helpers
13px/400
R$ 12.450,00
Space Mono 28px/700 · valores monetários
LABEL DE TABELA
Space Mono 11px/700 uppercase · table headers
02

Botões

8 variantes · 3 tamanhos · icon buttons · estados interativos com micro-animação.

Variantes
Tamanhos
Icon buttons
Tokens
VarianteBackgroundColorBorder
Primary--orange (#FF5500)#fffnone · shadow orange
Secondary--bg4 (#1C2733)--t (#fff)--border2
Outlinetransparent--orange--orange-border
Ghosttransparent--t2--border
Danger--danger-bg#E05040--danger-border
03

Formulários & Inputs

Inputs, selects, textareas — estados de foco, erro, sucesso e disabled com transições.

Estados
Exibido na confirmação da proposta
Chave PIX inválida. Verifique o formato.
E-mail verificado com sucesso.
Input monetário & Select
R$
Campo de busca
04

Cards & Layout

Metric cards, content cards com gradiente sutil, bento grid assimétrico — estética dark editorial.

Metric cards (dashboard KPI)
Saldo disponível
R$ 24.500
↑ 12% hoje
Pendentes
3
R$ 4.820,00 · aguardando aprovação
Liquidadas hoje
R$ 8.200
↑ 5 transações
Recusadas
1
↑ acima do normal
Bento grid (layout assimétrico)
Agente ativo
claude-opus-4
3 propostas pendentes · limite R$ 2.000/dia
Segurança
Biometria ativa
● Última verificação há 2 min
Política PIX
R$ 5.000
Limite diário · 2 de 5 mil usados
Próximo vencimento
API token expira
em 7 dias · claude-opus-4
Agentis Pay
Pagamentos PIX controlados por agentes de IA, com aprovação humana em cada transação.
Variantes de card
Card padrão
bg2 · border #1E2D3D · radius 16px
Card orange
gradient sutil + border orange-border
Card teal
gradient sutil + border teal-border
Card elevated
bg3 · border2 · shadow 0 8px 32px
Card com aura
Gradiente radial sutil para destacar conteúdo importante.
05

Alertas & Notificações

Alertas inline, toasts com contexto, chips de filtro — comunicação de estado semântica.

Alertas inline
claude-opus-4 propôs 3 transações
Consentimento biométrico pendente · Janela expira em 8 min
Proposta liquidada com sucesso
R$ 200,00 · João Silva · PIX · 14:23
Fronteira de política atingida
Limite diário de R$ 5.000,00 esgotado · Propostas bloqueadas
Proposta expirada automaticamente
Janela de aprovação encerrada · #TXN-0037 arquivada
Toasts
PIX enviado
R$ 200,00 para João Silva · 14:23
Aprovação pendente
claude-opus-4 aguarda biometria
Chips de filtro
Todos Pendentes Aprovados Recusados Expirados claude-opus-4 gpt-4o
06

Tabela de dados

Layout padrão para listagem de transações — toolbar com busca e filtro, hover states, badges de status.

Transações
Todos Pendentes 3 Aprovados Recusados
ID Destinatário Agente Valor Status Data
#TXN-0041
João Silva
joao@email.com
claude-opus-4 R$ 200,00 Aprovado 11 mar · 14:23
#TXN-0040
Fornecedor XYZ
cnpj:12.345.678
gpt-4o R$ 1.420,00 Pendente 11 mar · 11:05
#TXN-0039
Maria Fernanda
+55 11 99999-0000
claude-opus-4 R$ 3.000,00 Recusado 11 mar · 09:30
#TXN-0038
Coworking Beta
cowork@beta.io
gemini-1.5 R$ 800,00 Expirado 10 mar · 18:00
Exibindo 4 de 41 transações
...
07

Modal & Dialog

Dialogs de confirmação, formulários inline, alertas críticos — estrutura consistente com header + body + footer.

Política de gastos

Ajustar fronteira de agente

Ajustando fronteira de claude-opus-4. Propostas acima exigem revisão humana antes da execução.
R$

Revogar acesso do agente

Esta ação desconecta claude-opus-4 imediatamente. Propostas pendentes serão arquivadas.
3 propostas pendentes serão descartadas
08

Navegação

Sidebar de dashboard, tabs horizontais, breadcrumb e paginação — padrão editorial dark.

Tabs horizontais
Pendentes 3
Aprovados
Recusados
Expirados
Tab content area
Breadcrumb
Dashboard / Transações / #TXN-0041
Paginação
...
Keyboard shortcuts
⌘K Busca global ⌘A Aprovar selecionados Esc Fechar modal Navegar
09

Feed de atividade do agente

Timeline vertical de eventos — ações do agente, aprovações humanas, bloqueios de política.

Atividade recente
Todos Agente Humano
Proposta liquidada
14:23
R$ 200,00 · João Silva · PIX · aprovado por Thiago
Aprovadoclaude-opus-4 · #TXN-0041
Aguardando aprovação biométrica
11:05
gpt-4o propôs R$ 1.420,00 para Fornecedor XYZ · Notificação push enviada
⏱ 6:22 restantes
Proposta bloqueada pela política
09:30
R$ 3.000,00 ultrapassa a fronteira de claude-opus-4 (R$ 2.000/dia). Escalonado para revisão.
Bloqueado#TXN-0039 · arquivado
Agente conectado
08:00
claude-opus-4 autenticado via API key · Pronto para propostas