The Loomflo
brand system.
A complete reference for representing Loomflo with consistency and care — foundations, logo, colour, type, iconography, imagery, UI, motion, voice, layout and real-world applications.
Foundations
01Who Loomflo is, what we promise, and how we show up — the strategy every visual decision serves.
Remove the busywork from growth. We design AI systems that run quietly in the background so teams ship outcomes, not operations.
“Growth that runs while you sleep.”
Loomflo builds AI systems — HEO, lead generation and avatar content — that compound your growth automatically.
Compounding
Everything we build gets better and cheaper the longer it runs.
Ownership
Clients own the engine — their accounts, their data, their stack.
Clarity
Plain language, real numbers, no jargon or hype.
Honesty
We say who it’s for and who it isn’t. Trust beats persuasion.
Logo
02The wordmark is a refined serif paired with a flowing sage-to-sky gradient wave. The wave is the heart of the brand — continuous, automated flow. Let the mark breathe.
Keep clear space equal to the cap-height of the “L” on every side. Minimum digital width: 120px (wordmark) / 24px (wave mark).
- Recolour the wordmark or apply the gradient to the letters.
- Stretch, skew, rotate, add shadows or outlines.
- Swap the serif wordmark for a sans-serif.
- Place on a busy photo without a solid or blurred panel.
- Crowd it — respect the clear space.
Colour
03The official Loomflo palette is greenish-white: a soft-white canvas, deep navy ink, and a sage-green primary accent that flows into sky. Keep it light and let the accent signal action.
Lead with light neutrals, anchor with navy, and use sage sparingly so it always reads as “act here”.
| Combination | Use | Ratio | Rating |
|---|---|---|---|
| Navy #16303D on Canvas #F7F8F6 | Body text | 11.8 : 1 | AAA |
| White on Sage #3E8E7E | Buttons (large/medium) | 3.3 : 1 | AA Large |
| Sage #3E8E7E on White | Links / icons | 3.4 : 1 | AA Large |
| Sky Deep #2E78C0 on White | Small text accent | 4.6 : 1 | AA |
| Sage Light #6FB89A on White | Decorative only | 2.0 : 1 | Decorative |
Typography
04A serif wordmark for warmth; a clean grotesk system for everything else, so the product stays crisp and modern.
Logo & rare editorial accents only.
All headings & UI labels.
Paragraphs & long-form. JetBrains Mono for data.
Rules: headings use letter-spacing:-.025em; body line-height 1.6; mono labels uppercase with .12–.2em tracking; never set Fraunces below 18px or on dashboards.
Iconography
05Line icons, 24px grid, 1.6–1.7 stroke, rounded caps and joins. One weight throughout. Tint sage when interactive, navy/muted when decorative. No emoji, no filled glyphs.
Imagery
06Bright, airy and product-led. Favour real UI, dashboards and clean data over generic stock. Soft shadows, lots of white space, and the gradient wave as a recurring motif.
Avoid: heavy drop-shadows, neon glows, cluttered collages, literal “robot/AI brain” clichés, and oversaturated stock photography.
UI components
07Motion
08Motion should feel like flow — calm, weighty, intentional. Animate only transform and opacity, and always honour reduced-motion.
Reveal on scroll
Content rises 28–40px and fades over ~0.8s with a soft ease, staggered 80ms.
Magnetic buttons
Primary CTAs pull gently toward the cursor on fine pointers.
Living detail
Subtle perpetual motion — pulsing status dots, a flowing wave, scrolling marquees.
Voice & tone
09Calm & confident
We don’t shout. We state outcomes plainly and let results carry the weight.
“Rank on Google. Get cited by AI.” · “Unleash next-gen synergy!”
Concrete, not hype
Real verbs and real numbers — never vague superlatives.
“40+ articles a month that rank.” · “Best-in-class solutions.”
Flow as a theme
Language of movement and continuity — engines, loops, currents, compounding.
“Systems that run while you sleep.”
Honest
We say who it’s for and who it isn’t. Trust beats persuasion.
“Not a fit if you only have a handful of keywords.”
We use
We avoid
Loomflo is an AI growth studio. We build owned, automated systems — Hybrid Engine Optimization (HEO), AI lead generation and AI avatar content — that compound a company’s growth while the team sleeps.
Layout & spacing
10An 8-point spacing system, generous white space, and grid-based structure. Contain pages to ~1180–1280px and let sections breathe.
Applications
11How the system comes together across touchpoints.
Growth Engineer · Loomflo
hello@loomflo.ai · loomflo.ai