BetInsights

Brand Guidelines

Value Bets. Better Decisions.

Typography

Primary Font

Inter

Source: Google Fonts

URL: fonts.google.com/specimen/Inter

Weights: 400, 500, 600, 700

Fallback: system-ui, sans-serif

Usage: UI elements, body text, navigation

Secondary Font

Poppins

Source: Google Fonts

URL: fonts.google.com/specimen/Poppins

Weights: 400, 500, 600, 700

Fallback: sans-serif

Usage: Headlines, display text

Type Scale

Element	Size	Weight	Line Height	Usage
H1	36–48px	Bold (700)	1.2	Page titles, hero headlines
H2	28–32px	SemiBold (600)	1.3	Section headings
H3	20–24px	SemiBold (600)	1.4	Subsection headings
Body	16–18px	Regular (400)	1.6	Paragraphs, content
Small	12–14px	Regular (400)	1.5	Captions, labels

Primary Brand Colors

Dark Navy

HEX: #0C1C2D

HSL: hsl(210, 58%, 11%)

Headers, navigation, primary text

Green Accent

HEX: #009739

HSL: hsl(142, 100%, 30%)

CTAs, positive values, highlights

Yellow Accent

HEX: #FFCD1C

HSL: hsl(48, 100%, 50%)

Secondary highlights, icons

Bright Green

HEX: #1DB954

HSL: hsl(142, 76%, 45%)

Dark mode primary accent

UI Colors

Background (Light)

#FFFFFF

hsl(0, 0%, 100%)

Background (Dark)

#0C1C2D

hsl(210, 58%, 11%)

Foreground (Light)

#171717

hsl(0, 0%, 9%)

Foreground (Dark)

#E8F5E9

hsl(142, 25%, 95%)

Muted (Light)

#737373

hsl(0, 0%, 45%)

Muted (Dark)

#8FBC8F

hsl(142, 15%, 65%)

Card (Dark)

#112233

hsl(210, 50%, 14%)

Border (Light)

#E5E5E5

hsl(0, 0%, 90%)

Border (Dark)

#1A3A4A

hsl(200, 47%, 20%)

Semantic Colors

Purpose	HEX	Usage
Positive/Profit	#009739 / #1DB954	Success states, profit indicators
Negative/Loss	#E63946	Error states, loss indicators
Warning	#FFCD1C	Warnings, attention states

Design Principles

Tone

Professional, confident, and trustworthy — data-focused yet human.

Voice Style

Short, clear sentences; factual yet engaging. Avoid jargon, slang, or hype.

Corner Radius

12–16px (rounded-xl / rounded-2xl)

Shadows

Subtle (soft-shadow-md for cards/buttons)