Brand Identity · Version 1.1 · 2026

aviodeals
Brand Guidelines

Everything a designer, developer or partner needs to represent the aviodeals brand consistently.

aviodeals
Smart Air Travel Deals
02

Color palette

💡
Color role update — v1.1
Midnight is reserved for brand surfaces only (nav, hero, footer). Content areas use white and Off White for maximum readability and scan-ability — critical for mobile users comparing fares in bright sunlight across SE Asia and Latin America.
Avio Blue
#3B9EFF
★ Primary brand color. All CTAs, links, icons, highlights.
Deep Sky
#1A6FCC
Hover states, pressed buttons, dark-bg links.
Cloud
#EBF4FF
Selected states, info callouts, badge backgrounds.
Sky Tint
#DBEAFE
Subtle hover fills, alternating table rows.
White
#FFFFFF
★ Content cards, fare results, forms, modals.
Off White
#F5F7FA
★ Page background. The canvas for all content.
Midnight
#0B1829
Brand shell only: nav, hero, footer, email headers. Never for content areas.
Slate
#4A5568
Body text, secondary content, descriptions.

Color role hierarchy

Midnight #0B1829 → Nav · Hero · Footer · Email headers only
Avio Blue #3B9EFF → All CTAs · Links · Active states · Icons · Prices
White #FFFFFF → Cards · Fare results · Search forms · Modals
Off White #F5F7FA → Page canvas · Section separators · Input backgrounds

Typical page color layout

aviodeals Nav · Midnight #0B1829
Smart deals. Better flights.
Hero · Midnight #0B1829
Content area · Off White #F5F7FA
HAN → SGN
$42
SGN → BKK
$89
HAN → KUL
$110
Search all flights →
Footer · Midnight #0B1829
03

Typography

Outfit
Display, headings, logo wordmark
Weights: 600 (logo), 500 (h1–h3), 400 (h4+)
Tracking: −0.02em to −0.03em
↗ Google Fonts
Smart deals.
Better flights.
Find the best airfare in seconds
Section heading level three
DM Sans
Body, UI, captions, labels
Weights: 400 (body), 500 (labels), 300 (taglines)
Tracking: normal to +0.2em for caps
↗ Google Fonts
Compare hundreds of airlines and travel sites to find the lowest fares on flights to anywhere in the world.
UI label — medium weight
CAPTION · UPPERCASE · TRACKING
Type scale
Base: 16px / 1.65
Scale ratio: 1.25 (Major Third)
Min body: 13px
40 — Hero
32 — H1
24 — H2
18 — H3
16 — Body
13 — Small / UI
11 — Label caps
04

Taglines & messaging

Smart deals. Better flights.
Primary tagline — use in hero, email headers, print
Primary
Fly smart. Pay less.
Short form — social media, banners, ads
Short form
Every fare. Every flight. Best price.
Comprehensive — landing pages, partner pages
Long form
The smarter way to book flights.
SEO-friendly — meta descriptions, Google Ads
SEO / Ads
aviodeals.com — Smart Air Travel Deals
Tagline beneath logo — email footers, documents
Lockup sub

Primary domain

aviodeals.com

Redirect: aviodeal.com → aviodeals.com

05

Voice & tone

Smart, not clever
We communicate clearly and precisely. No jargon, no corporate speak.
"Save 40% on your next flight" not "Leverage our dynamic pricing engine"
Trustworthy, not stiff
We're confident and reliable. Warm but professional — never overly casual.
"We've got you covered" not "Our AI-powered algorithm ensures optimal outcomes"
Savvy, not pushy
We help customers make smart decisions. We never pressure or use dark patterns.
"This fare expires in 4 hours" not "ONLY 1 SEAT LEFT — BUY NOW!!!"
Accessible
Air travel for everyone
💡
Smart
Intelligent fare search
🌍
Global
LatAm · SE Asia · beyond
🤝
Trustworthy
No hidden fees ever
06

UI components & usage

Buttons

Font: Outfit 600 · Border radius: 8px · Padding: 10px 22px

Price badges

$189 $312
aviodeals price
$189 $312
aviodeals price
Save 39%
Best price

Spacing scale (base 4px)

4px
xs
8px
sm
12px
md
16px
lg
24px
xl
32px
2xl
48px
3xl
64px
4xl
Do
  • Use Midnight for nav, hero and footer only
  • Maintain clear space = icon height × 0.5 around logo
  • Use Outfit for all headings and the wordmark
  • Keep "avio" and "deals" always together as one word
  • Use Avio Blue #3B9EFF for all primary CTAs
  • Scale the icon proportionally at all sizes
  • Use the tagline "Smart deals. Better flights." as default
Don't
  • Don't use Midnight as a content area or card background
  • Don't change the "avio" / "deals" color split
  • Don't use the logo on busy photographic backgrounds
  • Don't use Arial, Roboto, or Inter in branded materials
  • Don't use red or orange — conflicts with airline branding
  • Don't write "Aviodeals" — always lowercase "aviodeals"
  • Don't add drop shadows to the logo
07

Asset checklist

Logo files (SVG)

  • ✓ aviodeals-logo-transparent-dark.svg
  • ✓ aviodeals-logo-transparent-light.svg
  • ✓ aviodeals-logo-dark.svg
  • ✓ aviodeals-logo-light.svg
  • ✓ aviodeals-icon-only.svg

Favicon files (PNG/ICO)

  • ✓ favicon.ico (multi-size)
  • ✓ favicon-16x16.png
  • ✓ favicon-32x32.png
  • ✓ favicon-64x64.png
  • ✓ favicon-128x128.png
  • ✓ favicon-256x256.png
  • ✓ apple-touch-icon.png (180×180)
  • ✓ icon-512x512.png (PWA / Android)

HTML font embed code

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet">