Talloo Brand Guide

The definitive reference for how Talloo looks, speaks, and shows up across every touchpoint.

What Talloo stands for.

Talloo builds and runs digital infrastructure for local businesses. Every brand decision supports a clear, consistent local presence.

“

“You don’t need to be famous everywhere, you just need to be Five Mile Famous.”

Talloo Core Positioning Statement

Four principles. One mission.

Every product, service, and communication maps back to at least one of these pillars.

01Local SEOBe present in local search, maps, reviews, and AI answers. Help nearby customers find and contact your business.

02EngagementStay top-of-mind through consistent, authentic content and reputation management. Trust is built before the first phone call.

03Website DevelopmentBuild a clear, fast website with service information, lead forms, click-to-call, and appointment scheduling.

04IntelligenceMake decisions backed by local data. Track how customers find you, how you compare, and where the next opportunity lies.

Who Talloo is.

Three words define the Talloo personality across every touchpoint.

Grounded

Talloo doesn't sell hype. Everything is local, practical, and built around real business outcomes. We speak plainly to owners who have seen it all.

Strategic

We don't guess. Talloo combines data, local intelligence, and proven frameworks to make deliberate decisions, and communicates them clearly.

Community-Led

Talloo works with local business owners. We build relationships through clear communication and ongoing service.

The Talloo wordmark.

The primary logo is the Talloo wordmark set in Inter Black. The wordmark always appears as a single solid color, never split or recolored mid-word. Never stretch, distort, or apply drop shadows to the logo.

Talloo

Primary · White Background

Talloo

Reversed · Black Background

Talloo

On Brand Color

Talloo

On Background Color

The official color system.

These are the only approved brand colors. #FF5000 is the primary accent, use it intentionally for calls to action, highlights, and key brand moments. Never approximate or substitute. Click a swatch to copy its hex.

Copy

Brand Orange

#FF5000

Primary Accent

Copy

Gray

#555555

Secondary / Body Text

Copy

Black

#000000

Headlines / Surfaces

Copy

White

#FFFFFF

Cards / Foreground

Copy

Background

#FAF8F5

Page Background

Use Orange For

Primary call-to-action buttons
Key stat callouts and highlights
Active navigation and hover states
Section labels and eyebrow text
Decorative accents on dark backgrounds

Avoid

Using orange for large body text blocks
Placing orange on orange backgrounds
Tinting or adjusting the orange value
Introducing colors outside this palette
Using gray as a primary CTA color
Gradient treatments on the brand orange

Inter. One typeface, every use.

Inter is the sole brand typeface. Consistency comes from weight variation: 900/800 for display and headlines, 700 for subheadings, 400 for body, and 500 to 600 for labels and UI elements.

Display

Inter 900 Tracking: −0.035em Hero headlines only

Five Mile Famous.

Heading 1

Inter 800 Tracking: −0.025em Page & section titles

Get found by customers nearby.

Heading 2

Inter 700 Tracking: −0.015em Subheadings, cards

The Growth Operating System.

Body

Inter 400 15 to 16px / 1.75 leading Paragraphs

We manage your digital presence across maps, reviews, local search, and AI answers so nearby customers can find you.

Label / Eyebrow

Inter 600 11px / Uppercase Section labels, tags

Verified · Local Business · 5-Mile Radius

How Talloo speaks.

Talloo communicates like a knowledgeable, no-nonsense local business advisor, direct, empathetic, and results-focused. Never salesy. Never vague.

Lead with outcomes: "More calls" before "we manage your profile."
Use specific numbers: "60+ digital surfaces," "50-mile referral radius."
Be direct about problems: "If you're not found, you don't exist."
Address the reader as "you", personal and actionable.
Use short sentences for emphasis. Explain with longer ones.
Sound confident, not aggressive. Expert, not arrogant.

Don’t

Use buzzword-heavy language: "holistic ecosystem," "omnichannel synergy."
Make promises that can't be measured or verified.
Write passive voice when active is available.
Pad headlines, cut every unnecessary word.
Use formal corporate language that alienates small business owners.
Use more than 2 exclamation points per page of content.

Lines that define us.

Use these approved phrases consistently across campaigns, ads, and sales materials.

Be Five Mile Famous.

Primary Tagline

Get found by customers nearby.

Hero / Page Header

Your Growth Operating System.

Hub Product

Consistency, clarity, and results.

Services Summary

High-trust networking. No cost to join.

Connect Events

Visual language principles.

Photography and visuals should reinforce Talloo's grounded, community character. Always real, never stock-generic.

Local & Authentic

Real local businesses, real storefronts, real neighborhoods. Avoid polished stock imagery of generic offices.

Human Connection

Handshakes, conversations, and community settings. Referrals are human, imagery should reflect that.

Data Made Visual

Dashboards, maps, and metrics reinforce the Intelligence pillar and communicate tangible credibility.

Digital Presence

Google Maps pins, phone screens with search results, and review interfaces ground the brand in reality.

Color Treatment

Where possible, apply a subtle #FF5000 tint or black duotone to photography for brand cohesion.

Ideal Customer

Show local business owners: tradespeople, restaurateurs, retailers, service providers, not suits.

App-level design system.

Border Radius

6px

8px

base / lg

10px

14px

2xl

1rem

full

9999px

Base spacing: 0.25rem (4px). Card padding: 16px. Form gaps: 12px.

Dark Mode Tokens (Default)

Card surfaces use glassmorphism: rgba(255,255,255,0.03) + blur(16px) + rgba(255,255,255,0.06) border.

TokenValueUsage

--background#000000Page background

--card#010101 + glass overlayCard surfaces

--border#141414 (8% white)All borders

--input#080808Input field backgrounds

--muted-foreground#888888Placeholder, secondary text

--primary#FF5000Accent color

shadow2px hard, hsl(0 0% 0% / 0.2)Elevated components

hover overlayrgba(255,255,255, 0.04)Hover state via pseudo-element

active overlayrgba(255,255,255, 0.09)Active state via pseudo-element

Light Mode Tokens

Flat design, no shadows, no glassmorphism.

TokenValueUsage

--background#FAF8F5Page background

--card#FFFFFFCard surfaces, flat, no blur

--border#E2E4ECAll borders

--foreground#555555Body text

shadownone (flat design)No elevation in light mode

hover overlayrgba(0,0,0, 0.02)Hover state via pseudo-element

active overlayrgba(0,0,0, 0.04)Active state via pseudo-element

Component Patterns

Buttons

· Primary: #FF5000, hover #E04500
· Destructive: muted treatment, not red
· Touch target: min 44px height on mobile

Status Badges

ActivePendingExpiredSentDraftBrand

Low-opacity outline approach, never solid fill for status badges.

CSS Variables & Glass Utility

:root {
  --primary:          19 100% 50%;     /* #FF5000 */
  --background:        0   0%   0%;    /* #000000 */
  --foreground:        0   0% 100%;    /* #FFFFFF */
  --card:              0   0%   0.4%;  /* #010101 */
  --muted-foreground:  0   0%  53%;    /* #888888 */
  --border:            0   0%   8%;    /* #141414 */
  --radius:            0.625rem;
  --font-sans:         'Inter', sans-serif;
}

.glass-card {
  background:      rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(16px);
  border-color:    rgba(255, 255, 255, 0.06);
}

.glass-card is dark mode only. Light mode uses bg-white border-[#E2E4EC], no blur.