01
Strategist
Data-Driven Architect
Market insight, competitive positioning, ROI-focused decision making. The Strategist asks the only question that matters: does this actually move the needle?
// clarity over cleverness
brand.system · v1.0 · February 2026
Canonical Brand Guidelines
Identity,
Forged.
The spark behind the system. One mind, four voices, and the shared DNA that connects them all.
Explore
The Ecosystem Map
The Pendulum
One creative mind. Four distinct expressions. Not contradictions — a spectrum. The same spine runs through all of them.
Storybook · Emotional
The bridge
Operating System · Systematic
Insights
Storybook · Editorial
Insights
Cormorant serif. Cream light. Watercolor warmth. The most human voice.
Brand Guide →
Portfolio
The Bridge · Flex
Portfolio
Art + systems. Photography + case studies. Borrows from both ends.
This Page →
The Hub
Portal
OS · Product Brand
The Portal
Dark. Sharp. JetBrains Mono. An operating system with a soul.
Enter Portal →01 — Brand Philosophy
The Trinity Framework
Three forces shape every output under this brand. Not roles. Not job titles. A cognitive framework — for how thinking becomes doing.
02
Storyteller
Narrative Craftsperson
Brand voice, creative direction, emotional resonance. The Storyteller asks the question everyone else ignores: how do we make them feel something real?
// emotion drives action
03
Orchestrator
Integration Conductor
Cross-functional execution where data meets story. The Orchestrator doesn't just plan — it delivers. The hat worn when the other two need to converge into something real.
// vision into reality
This isn't a personal brand in the influencer sense. It's a professional operating system — built to communicate credibility, creativity, and execution capability at a glance.
02 — Channel Map
Four Voices, One Spine
The same coral, teal, and intentionality runs through every channel. What changes is the expression — the degree of warmth, the weight of the type, the ratio of story to system.
Insights
luis-gilberto.com/insights/
The storybook end of the spectrum. Cormorant Garamond-led, cream default, watercolor warmth. Long-form editorial content — where the Storyteller hat lives permanently. Slightly different aesthetic rules apply here by design.
Portfolio
luis-gilberto.com/
The bridge. This is where the full human exists — photography, case studies, timeline, the gated landing page. Borrows warmth from Insights, precision from Portal. The most latitude of any channel because it's the origin point.
The Hub
luis-gilberto.com/TheHub/
Portal OS with portfolio soul. Markets the consulting practice and the system it runs on. Treats UI screenshots as art. More systematic than Portfolio but warmer than Portal — the brand that explains the brand.
Portal
portal.luis-gilberto.com
The operating system end. Dark by default, JetBrains Mono, Big Shoulders Display, sharp geometry. A product brand — an OS with a soul. Distinct enough to protect as IP. Its brand guidelines live separately.
03 — Visual Identity
Logo Lockups
The wordmark and logomark are not decorative. They carry the entire brand. Handle with precision — no filter:invert(), no unauthorized color variants.
Primary Lockups — Always on Dark
Full Wordmark
Logomark / Icon
Rule: White variants on dark surfaces only. Light variants on cream/white surfaces. Never apply CSS filters to the logo. Two separate image assets — swap at the source, not with code.
Logo Usage Rules
✓ Do
Use AUg_logo_White.png on dark backgrounds
Use AUg_logo_Dark.png on light backgrounds
Swap with a second img tag toggled by data-theme
✗ Don't
Apply filter: invert() — this corrupts the coral accent in the mark
Stretch, recolor, or apply drop shadows to the logo
Use the wordmark below 28px height
04 — Color System
The Palette
Two accent colors. One spine. Coral is the emotional signal — attention, warmth, action. Teal is the system signal — intelligence, progress, confirmation.
Coral#F96F6ECTAs · Active states · Emotion
Teal#2ED3C6Stats · Progress · System signals
Cream#FAF7F4Ink dark mode · Light page bg
Obsidian#0E0C0ADark mode bg · Portal default
Canonical CSS Tokens
| Variable | Role | Dark Mode | Light Mode |
|---|---|---|---|
| --coral | Primary accent | #F96F6E | #F96F6E |
| --teal | Secondary accent | #2ED3C6 | #2ED3C6 |
| --bg | Page background | #0E0C0A | #F5F0EB |
| --bg-raised | Header / raised surface | #161310 | #FFF9F5 |
| --bg-card | Card / elevated | #1C1916 | #FFFFFF |
| --ink | Primary text | #FAF7F4 | #0A0A0A |
| --ink-soft | Secondary text | rgba(250,247,244,0.55) / rgba(10,10,10,0.6) | |
| --rule | Borders / dividers | rgba(250,247,244,0.08) / rgba(10,10,10,0.08) | |
05 — Typography
Three Fonts, Three Hats
Each typeface maps to a voice in the Trinity. Using all three correctly is itself a brand signal — it shows the system thinking behind the work.
Brand
System
System
Caracas meets
Cascadia
Cascadia
Making technology feel human through clarity, beautiful execution, and systems that scale — without losing the warmth in the signal.
--coral: #F96F6E;
--teal: #2ED3C6;
system.ready() ✓
--teal: #2ED3C6;
system.ready() ✓
06 — Voice & Tone
How This Brand Speaks
The voice is consistent across channels. The tone adapts. Insights is warmer. Portal is sharper. Portfolio is personal. Hub is confident. But the underlying voice — specific, intentional, never generic — never changes.
-
01
Specific, Not Vague
"568M impressions" not "impressive results"
Numbers. Real details. Named outputs. The work speaks with evidence, not adjectives. If you can't point to it, don't claim it.
-
02
Intentional, Not Accidental
Every pixel has a reason. Every word earns its place.
This brand doesn't tolerate filler. If a sentence, element, or asset can be removed without loss — remove it. What remains is the brand.
-
03
Warm but Not Soft
Human doesn't mean hesitant.
The Caracas warmth shows up as directness, not distance. Sentences are short when clarity demands it. Long when the story deserves the room. Never timid.
-
04
Gemini Energy — The Contrast Is The Point
Storybook and operating system. Both. Always.
The pendulum doesn't have a resting position. This brand thrives in the swing between emotional and analytical, between the poem and the spec sheet. That tension is the identity, not a problem to solve.
07 — Do's & Don'ts
Brand Guardrails
Rules exist so that when you break them intentionally, it means something.
✓ Do
Use coral for primary CTAs, active states, and emotional anchors
Use teal for system states, data, progress indicators, and confirmation
Keep token variable names aligned: --coral, --teal, --ink, --bg, --rule
✗ Don't
Mix token naming systems across files — choose the canonical set and stay there
Use coral and teal together at equal weight — one leads, one supports per context
Use purple, orange, or other accent colors without explicit approval
✓ Do
Let the Insights channel be softer — Cormorant Garamond, light default, storybook warmth. That divergence is intentional and protected.
Let the Portal channel be sharper — dark default, mono type, geometric. Also intentional, also protected.
✗ Don't
Try to make every channel look the same — homogenization kills the spectrum and erases the identity
Introduce new typefaces without updating this document and aligning all active pages
✓ Do
Use absolute paths for all assets: /assets/images/foo.png
Use the canonical four-channel megamenu in all header implementations
✗ Don't
Use relative paths for assets in subdirectory files — they break on navigation
Revert the Portal nav link to /about.html — it always points to portal.luis-gilberto.com
08 — Quick Reference
Brief an AI Agent
Paste this block at the start of any design or development session to establish full brand context instantly.
Brand Context Block
v1.0 · Feb 2026## LUIS GILBERTO — BRAND CONTEXT IDENTITY: Integrated Marketing strategist, 15+ years in tech (Microsoft, Edge, Copilot). AESTHETIC: "Caracas meets Cascadia" — Latin warmth + Scandinavian minimalism. FRAMEWORK: Trinity — Strategist (data), Storyteller (emotion), Orchestrator (execution). ## ECOSYSTEM — Four Channels Portfolio: luis-gilberto.com/ — The bridge. Flex. Art + systems. Most latitude. Insights: luis-gilberto.com/insights/ — Storybook end. Cormorant. Cream. Emotional. Hub: luis-gilberto.com/TheHub/ — Portal OS + portfolio warmth. Markets the system. Portal: portal.luis-gilberto.com — OS end. Dark. Mono. Sharp. IP-protected brand. ## DESIGN TOKENS (Canonical) --coral: #F96F6E /* CTAs, emotion, active states */ --teal: #2ED3C6 /* System, progress, data */ --bg: #0E0C0A /* Dark bg | light: #F5F0EB */ --bg-raised: #161310 /* Header | light: #FFF9F5 */ --bg-card: #1C1916 /* Cards | light: #FFFFFF */ --ink: #FAF7F4 /* Text | light: #0A0A0A */ --rule: rgba(250,247,244,0.08) ## TYPOGRAPHY Display: Big Shoulders Display 700/800/900 — uppercase, commanding (Strategist) Serif: Cormorant Garamond 300/400 italic — editorial, warm (Storyteller) UI: Inter 300–600 — organized, clear (Orchestrator) Mono: JetBrains Mono — Portal/technical contexts only ## NAVIGATION (Canonical — never deviate) Four triggers: Portfolio · Insights · The Hub · Portal Portal URL: portal.luis-gilberto.com (NEVER /about.html) Asset paths: Absolute only — /assets/images/foo.png Logo swap: Two img tags per theme — no filter:invert()