BetInsights
Guia de Marca
Apostas Inteligentes. Melhores Decisões.
Tipografia
Fonte Principal
Inter
Fonte: Google Fonts
URL: fonts.google.com/specimen/Inter
Pesos: 400, 500, 600, 700
Fallback: system-ui, sans-serif
Uso: Elementos de UI, texto principal, navegação
Fonte Secundária
Poppins
Fonte: Google Fonts
URL: fonts.google.com/specimen/Poppins
Pesos: 400, 500, 600, 700
Fallback: sans-serif
Uso: Títulos, texto de display
Escala de Tipografia
| Elemento | Tamanho | Peso | Altura da Linha | Uso |
|---|---|---|---|---|
| H1 | 36–48px | Bold (700) | 1.2 | Títulos de página, headlines hero |
| H2 | 28–32px | SemiBold (600) | 1.3 | Cabeçalhos de seção |
| H3 | 20–24px | SemiBold (600) | 1.4 | Cabeçalhos de subseção |
| Body | 16–18px | Regular (400) | 1.6 | Parágrafos, conteúdo |
| Small | 12–14px | Regular (400) | 1.5 | Legendas, rótulos |
Cores Primárias da Marca
Azul Marinho Escuro
HEX: #0C1C2D
HSL: hsl(210, 58%, 11%)
Cabeçalhos, navegação, texto principal
Verde Destaque
HEX: #009739
HSL: hsl(142, 100%, 30%)
CTAs, valores positivos, destaques
Amarelo Destaque
HEX: #FFCD1C
HSL: hsl(48, 100%, 50%)
Destaques secundários, ícones
Verde Brilhante
HEX: #1DB954
HSL: hsl(142, 76%, 45%)
Destaque principal modo escuro
Cores de UI
Fundo (Claro)
#FFFFFF
hsl(0, 0%, 100%)
Fundo (Escuro)
#0C1C2D
hsl(210, 58%, 11%)
Primeiro Plano (Claro)
#171717
hsl(0, 0%, 9%)
Primeiro Plano (Escuro)
#E8F5E9
hsl(142, 25%, 95%)
Suave (Claro)
#737373
hsl(0, 0%, 45%)
Suave (Escuro)
#8FBC8F
hsl(142, 15%, 65%)
Card (Escuro)
#112233
hsl(210, 50%, 14%)
Borda (Claro)
#E5E5E5
hsl(0, 0%, 90%)
Borda (Escuro)
#1A3A4A
hsl(200, 47%, 20%)
Cores Semânticas
| Propósito | Cor | HEX | Uso |
|---|---|---|---|
| Positivo/Lucro | #009739 / #1DB954 | Estados de sucesso, indicadores de lucro | |
| Negativo/Perda | #E63946 | Estados de erro, indicadores de perda | |
| Aviso | #FFCD1C | Avisos, estados de atenção |
Princípios de Design
Tom
Profissional, confiante e confiável — focado em dados mas humano.
Estilo de Voz
Frases curtas e claras; factuais mas envolventes. Evitar jargão, gírias ou exageros.
Raio de Canto
12–16px (rounded-xl / rounded-2xl)
Sombras
Sutis (soft-shadow-md para cards/botões)