OFFICIAL BRAND BOOK v2.2

Avalanche Agency Design System

The complete visual language, design tokens, color codes, UI component specs, and brand guidelines for Avalanche Agency and Enlight Group digital platforms.

📘 1. Identity & Brand Mission

Avalanche Agency is the digital marketing, web engineering, and automation engine inside Enlight Group. We build high-performance digital ecosystems with senior expertise and Christian stewardship principles.

Four Core Service Pillars ZERO TEMPLATES

🌐

1. Infrastructure

Domains, SSL, DNS, email servers, high-speed hosting, and cloud architecture.

💻

2. Development

Custom web engineering, Web Apps, SaaS, Monobank Acquiring, and multi-language portals.

✍️

3. Content & AI

Brand storytelling, copywriting, professional translations, and 24/7 AI agents.

🚀

4. Growth Marketing

SEO optimization, performance marketing, SMM, and international pipeline expansion.

🎨 2. Logo System & Variations

The Avalanche Agency logo mark consists of a stylized geometric double "A" monogram inside a rounded sky-blue square, paired with bold slate navy typography.

1. WIDE BRAND BLUE CANVAS LOCKUP (ABOUT PAGE CANVA)

Avalanche Agency

2. PRIMARY DESKTOP LOGO LOCKUP

3. MOBILE ICON BADGE (38px / 50% Radius)

💎 3. Color Tokens & Color Codes

Every color in the Avalanche Agency design system has exact HEX, RGB, and HSL color codes with 1-click copy support.

Brand Sky Blue

HEX: #5FB3F9

RGB: rgb(95, 179, 249)

HSL: hsl(207, 92%, 67%)

Deep Royal Blue

HEX: #5FB3F9

RGB: rgb(30, 64, 175)

HSL: hsl(226, 71%, 40%)

Electric Blue

HEX: #5FB3F9

RGB: rgb(37, 99, 235)

HSL: hsl(221, 83%, 53%)

Dark Slate Navy

HEX: #0F172A

RGB: rgb(15, 23, 42)

HSL: hsl(222, 47%, 11%)

Soft Sky Tint

HEX: #F0F7FF

RGB: rgb(240, 247, 255)

HSL: hsl(212, 100%, 97%)

Success Emerald

HEX: #10B981

RGB: rgb(16, 185, 129)

HSL: hsl(160, 84%, 39%)

✍️ 4. Typography Hierarchy

We use Inter as our primary typeface for clean legibility, modern letter-spacing, and geometric precision across desktop and mobile devices.

HERO HEADLINE (H1) — Inter 900 Black

Premium Web Solutions for Modern Businesses

SECTION HEADLINE (H2) — Inter 800 Extra-Bold

What Our Clients Say

CARD TITLE (H3/H4) — Inter 700 Bold

Four pillars. Zero risk.

BODY TEXT & LEAD — Inter 400 Regular / 600 Semi-Bold

From infrastructure to growth — Avalanche Agency builds the complete digital foundation your company deserves, with the detail that sets market leaders apart.

🧩 5. UI Components Library

All UI components follow strict Avalanche Agency preferences: NO browser alert() popups, inline toast notifications, clean paper-sheet specification cards, and mobile-friendly touch targets.

Interactive Component Demos

BUTTON VARIANTS

BADGES & PILLS

ONE ACCOUNTABLE TEAM ✓ VERIFIED ADMIN

PROJECT SPEC SHEET CARD

Describe your project PROJECT SPEC SHEET

🚫 6. Hard Brand Guardrails

Strict operational and design rules to preserve brand integrity and client trust.

RULE 1

NO BROWSER ALERT POPUPS: Never use native alert(), confirm(), or prompt() dialogs anywhere on the site. Always use inline green badges, button state changes, or floating UI toast notifications.

RULE 2

COLOR CONSISTENCY: Always follow the brand logo design system (#5FB3F9 Sky Blue). Never use dark off-brand gradients or unapproved color schemes.

RULE 3

MOBILE LOGO TEXT HIDING: On mobile screens (<= 768px), hide logo text 'Avalanche Agency' completely and display only the enlarged 38px logo badge.

RULE 4

WHITE-BLUE-WHITE FLAG RULE: In the language dropdown selector, the Russian language flag MUST use white-blue-white horizontal stripes.

📦 7. Brand Asset Downloads

Download production-ready SVG and PNG logos, brand icons, and CSS token sheets.

⬇️ Download Primary Logo PNG