Brand Guidelines — v1.0

Krew
Brand
System

Identidade visual completa para a infraestrutura financeira da creator economy.

Nome
Krew
Tagline
From creator to company
Categoria
Fintech / Creator Economy
Versão
1.0 — 2025
Sobre a marca

O que a Krew representa

∞

Infraestrutura invisível

A Krew opera nos bastidores do negócio do creator — como o Stripe opera nos bastidores do e-commerce. Não queremos aparecer; queremos que o creator apareça.

↗

From creator to company

Cada creator é uma empresa que ainda não sabe disso. A Krew existe para tornar essa transformação real, simples e inevitável.

⬡

Tech primeiro

Não somos agência. Não somos contabilidade. Somos software. A marca reflete isso: precisa, moderna, sem ornamentos desnecessários.

◎

Escala com alma

Construída para escalar via software, mas com uma voz que fala diretamente com creators — humana, direta, sem jargão financeiro.

02 — Cores

Paleta de cores

Black
#000000
RGB 0, 0, 0
Cor primária · fundos · textos sobre claro
White
#F5F7FA
RGB 245, 247, 250
Textos · fundos alternativos · tipografia
Mint
#40F8CF
RGB 64, 248, 207
Accent primário · CTA · destaques · K do logo
Yellow
#EEFF3D
RGB 238, 255, 61
Accent secundário · alertas positivos · energia
Gradient
#40F8CF → #EEFF3D
135deg linear
Destaque máximo · hero · elementos premium
Proporção de uso recomendada
Black
60%
White
25%
Mint
10%
Yellow
5%
Gradient
5%
Krew
Ink + Mint — Principal
Krew
Mint + Ink — CTA
Krew
Yellow + Ink — Destaque
Krew
White + Ink — Alternativo
Krew
Ink + White — Corpo de texto
Krew
Mint ghost — Badges/tags
Krew
Gradient + Ink — Hero / premium
Krew
Gradient text — Títulos especiais
03 — Tipografia

Sistema tipográfico

Display & Headings
Syne
Usada em títulos, wordmark e elementos de destaque. Peso 800 para display, 600–700 para headings.
Body & UI
DM Sans
Usada em corpo de texto e UI. Peso 300–400 para leitura, 500 para ênfase.
Monospace — Labels & Código
DM Mono
Usada em labels, badges, dados financeiros, código e elementos técnicos.
Display
Syne 800
72px / -0.04em
LH 0.95
Krew
H1
Syne 700
48px / -0.03em
LH 1.05
Infraestrutura financeira
H2
Syne 600
32px / -0.02em
LH 1.1
Seu negócio organizado
H3
Syne 600
22px / -0.01em
LH 1.2
Faturamento do mês
Body
DM Sans 300
16px / 0em
LH 1.75
Centralize todos os seus recebimentos em um só lugar. A Krew organiza publis, contratos e receitas de plataformas automaticamente.
Caption
DM Sans 400
13px / 0em
LH 1.6
Atualizado em tempo real · Dados sincronizados automaticamente
Mono
DM Mono 400
13px / 0.06em
Uppercase
R$ 84.320,00 · FATURAMENTO TOTAL
04 — Voz & Tom

Como a Krew fala

Faça

  • Fale como um sócio inteligente, não como um banco
  • Use linguagem direta e sem jargão financeiro desnecessário
  • Celebre o crescimento do creator com dados reais
  • Seja preciso — numbers talk, não use metáforas vagas
  • Trate o creator como fundador de empresa, não como influencer

Evite

  • Linguagem de agência ou assessoria de imprensa
  • Termos financeiros complexos sem contexto
  • Tom condescendente ou de "educação financeira"
  • Exageros e superlativos sem sustentação
  • Emojis excessivos ou linguagem juvenil demais
Exemplos de copy
Hero / headline
Você cria. A Krew cuida do resto.
Sub-headline
Centralize receitas, organize contratos e tenha previsibilidade financeira real — tudo em um lugar.
CTA principal
Abrir minha empresa
CTA secundário
Ver como funciona
Erro / feedback
Algo deu errado aqui. Tenta de novo em alguns segundos.
Sucesso
Pagamento recebido. R$ 12.400,00 já está na sua conta Krew.
Onboarding
Vamos estruturar o seu negócio. Leva menos de 5 minutos.
05 — Componentes

UI Components

Botões
Badges & Tags
Ativo Publi confirmada Pendente Em análise Rascunho Vencido CNPJ aberto Pago
Cards financeiros
Faturamento do mês
Março 2025
+18%
R$ 84.320
↑ R$ 12.840 vs mês anterior
Próximo recebimento
Marca X · Publi Instagram
Em 3 dias
R$ 15.000
Contrato #0482 · Assinado
Campos de formulário
Nome da campanha
Valor (R$)
Data de vencimento
06 — Motion

Princípios de animação

Pulse
Duration: 2s
Easing: ease-in-out
Uso: loading states, live indicators
Slide
Duration: 300ms
Easing: cubic-bezier(0.4, 0, 0.2, 1)
Uso: page transitions, modals
Fade
Duration: 200ms
Easing: ease
Uso: tooltips, dropdowns, overlays
Intencional
Cada animação serve a um propósito. Sem movimento decorativo. Motion comunica estado e feedback.
Rápido
Durations curtas. Nunca mais que 400ms para transições de UI. O creator não tem tempo a perder.
Suave
Easing sempre ease-in-out ou cubic-bezier customizado. Nunca linear — parece mecânico.
07 — Espaçamento

Sistema de grid

--sp-4
4px
Micro — gaps internos de componentes
--sp-8
8px
XS — padding de badges, gaps de badges
--sp-12
12px
SM — padding de botões small, gaps de lista
--sp-16
16px
MD — padding de inputs, gaps de formulário
--sp-24
24px
LG — padding de cards, gaps de seção interna
--sp-48
48px
XL — padding de seções, margin de componentes grandes
--sp-80
80px
2XL — separação entre seções de página
--sp-120
120px
3XL — padding vertical de seções full-width