Brand — tuempresa.digital
canonical· designer · updated 2026-06-28 · source
CANONICAL brand reference. This is the single source of truth for the brand identity of tuempresa.digital (longform: "Tu Empresa Digital"). Locked brand, designed in the Paper kit BRAND KIT V0.1. Transcribed here verbatim — do not redesign without a new brand decision.
Scope: this doc governs the Aurea brand core (marca) — the warm, editorial identity that every surface inherits. Each product surface (Documentation, Admin, and the app Tu Empresa Digital OS /
tedos) honors that core with its own matiz — see §5 One core, many surfaces. The app-surface spec (structure, density, interaction) lives intedos-design-system.md.Last updated: 2026-06-05
Table of contents
- Naming & layer model
- The concept — Aurea / phyllotaxis
- Values
- Growth stages — the mark accumulates
- One core, many surfaces — Aurea-derived theming
- Palette — "Botánica Restrained"
- Typography & wordmark
- Lockups
- Usage rules
- Vision — the mark IS the product
1. Naming & layer model
There are four names in this system. Keeping them distinct is non-negotiable — they describe different things at different layers.
| Term | What it is | Layer | Lives in |
|---|---|---|---|
| tuempresa.digital | The brand / wordmark | Marca (warm) | This doc |
| Aurea | The concept name only | Idea / origin story | This doc, §2 |
| Tu Empresa Digital OS | The product (tedos) | Producto (Aurea-derived) | Design system doc |
| claude-plugin | The internal "brain" | Method (internal-only) | .claude/ kit |
tuempresa.digital — the brand / wordmark
The brand. Always written lowercase: tuempresa.digital. Longform
"Tu Empresa Digital" is allowed in running prose. The . between tuempresa
and digital is orthography, not decoration — it is part of the name and
is always kept. The brand lives in warm tones (§6).
Aurea — the concept name only
Aurea is the concept, not a product and not a wordmark. It names the idea that explains where the brand comes from: the ángulo áureo (golden angle), the rule a sunflower obeys without knowing it. Use "Aurea" when telling the origin/philosophy story. Never put "Aurea" on a button, a nav, an app icon, or a wordmark — it is not a product-facing label.
Tu Empresa Digital OS (tedos) — the product
The product is the operating system — "las capas" (the layers). It derives
its surfaces from the Aurea core (§5) with a user-focused matiz — ease and
usability prioritized. Its structure, density, and interaction spec live in
tedos-design-system.md. The wordmark typography
stays a brand-piece asset, not OS chrome.
claude-plugin — the internal "brain"
Internal-only. The method used to build the product: the .claude/ kit of
agents, skills, and memory. It is not a product-facing layer and never appears
in brand or product surfaces.
The bridge
"Lo que hoy es marca, mañana es producto."
The seed-head symbol that is the brand today becomes the product's Memoria feature tomorrow. The same rule (the golden angle) governs both. See §10.
2. The concept — Aurea / phyllotaxis
The mark is a sunflower seed-head, built with the Vogel model of phyllotaxis. Each new point enters rotated exactly 137.50776° (the golden angle) from the previous one, placed at distance c·√n from the center.
"Es la regla que un girasol obedece sin saberla."
That is the whole system. The angle never changes; only the count grows.
Hero copy (verbatim — use where the brand introduces itself)
Tagline (hero):
"Una marca que crece con lo que recordamos."
Hero sub:
"El símbolo de hoy son 13 semillas. El de mañana, cien. La regla es la misma: el ángulo áureo, replicado por Gaudí, robado de los girasoles."
Lineage
"Estudiado por Da Vinci, formalizado por Bonnet (1754), Vogel (1979). Gaudí lo usó para columnas que se ramifican. Cada cliente nuestro lo escribe sin saberlo, agregando hechos a su negocio."
| Figure | Year | Contribution |
|---|---|---|
| Leonardo da Vinci | — | Studied the pattern |
| Charles Bonnet | 1754 | Formalized phyllotaxis |
| Helmut Vogel | 1979 | The mathematical model the mark is built on |
| Antoni Gaudí | — | Used the golden angle for branching columns |
The lineage matters because it grounds the brand in something real and old, not in "AI" novelty. Every client writes the same pattern without knowing it, by adding facts to their business.
Construction constants (for anyone reproducing the mark)
| Constant | Value | Meaning |
|---|---|---|
| Golden angle | 137.50776° | Rotation between each successive seed |
| Radius of n-th seed | c · √n | Distance from center (c = packing constant) |
| Official count | n = 13 | The shipped brand symbol (§4) |
| Seeds | Solid dots | Never rings/outline (§9) |
| Bounding box | Square | The mark always fits a square (§9) |
3. Values
Three values, plus the constant that generates the mark:
Memoria · Eficacia · Gentileza · 137.50776°
| Value | What it means for the brand |
|---|---|
| Memoria | Accumulation, persistence, living context. Nothing is forgotten. |
| Eficacia | Few words, real results. We implement, we don't just recommend. |
| Gentileza | Owner-to-owner. No condescension, no jargon. |
| 137.50776° | The golden angle — the rule that ties the whole system together. |
Voice/tone detail for copy lives in
brand-tone.md, which derives from these same three values.
4. Growth stages — the mark accumulates
The official symbol is n = 13. The mark grows as the business accumulates memory, following the Fibonacci sequence. This is the core idea: the brand is not static — it is a snapshot of a living, growing seed-field.
| Stage | When | Copy |
|---|---|---|
| n = 1 | Day 1 | "El primer hecho. Tu nombre, tu producto, nada más." |
| n = 5 | Day 7 | "Conexiones iniciales. La geometría del girasol aparece." |
| n = 13 ★ | Week 2 | OFFICIAL SYMBOL — "La forma con la que arranca la marca de TuEmpresa.Digital." |
| n = 34 | Month 1 | "Las espirales son evidentes. Un negocio con un mes de operación." |
| n = 89 | Month 3 | "Denso. Las 21 espirales internas son visibles." |
★ = the shipped brand symbol. When you need "the logo", it is n = 13.
The other counts are storytelling and motion assets (e.g. an animated growth sequence, an editorial spread on how the mark accumulates). They are not substitutes for the official mark in product or identity contexts.
5. One core, many surfaces — Aurea-derived theming
This is the governing law of the visual system (brand decision — José, 2026-06-05; supersedes the prior "warm brand vs. cool product" split and retires the cool zinc/indigo product palette):
"Todo debe hacerle honor al brand Aurea, pero con sus matices. La documentación tiene su propio estilo, el admin también, y la app también — un estilo único enfocado a los usuarios, donde la facilidad y la usabilidad se priorizan."
There is one brand core — Aurea: warm, editorial, "Botánica Restrained" (§6). Every surface honors that core — inheriting its palette family, typography, and the seed-head mark — but each derives its own matiz (sub-theme) tuned to its job:
| Surface | Matiz tunes for | Token layer |
|---|---|---|
| Brand pieces (landing, decks, social, email, mark) | Editorial, outward-facing — it invites | packages/ui/src/styles/brand-tokens.css |
| Documentation (docs site / plans) | Calm readability, long-form | matiz TBD — Designer |
Admin (apps/admin) | Operational clarity, density | matiz TBD — Designer |
App — Tu Empresa Digital OS (apps/desktop) | User-focused — ease & usability first | matiz TBD — Designer (replaces the old cool globals.css) |
Hard rule: every surface traces back to the Aurea core — same palette family, same mark, same accent discipline (one Azafrán moment per composition, §6). Matices differ in density, contrast, and emphasis, never in a different brand. There is no longer a "cool product" palette to keep separate from a "warm brand."
The per-surface matiz token architecture (Aurea core → docs / admin / app sub-themes) is the Designer's open deliverable. Until it lands, surfaces inherit the brand core tokens directly. PR #127 (Client Dashboard) was built on the retired cool tokens and must be re-themed against the app matiz.
6. Palette — "Botánica Restrained"
Warm. Brand surfaces only. Six colors. One accent.
| Name | Hex | Role |
|---|---|---|
| Pergamino | #F8F4EC | Primary brand background. Warms the white without losing clarity. |
| Hueso | #EDE5D6 | Cards, separators, second surface level. |
| Polvo | #A8A097 | Meta labels, captions, construction lines in specs. |
| Grafito | #4A4640 | Body text in long pieces. Not black — warm ash. |
| Tinta | #0F0E0C | The symbol, the headlines, the brand's black. Warm, not neutral. |
| Azafrán | #C97A2C | SOLE ACCENT. The spark. A single piece per screen — underline, milestone, call. |
CSS custom properties for these live in
packages/ui/src/styles/brand-tokens.css. They are the Aurea core tokens — every surface's matiz (docs, admin, app) derives from them (§5).
Symbol per surface
The symbol's color is always the inverse of its background — "el color es siempre el del fondo invertido."
| Surface | Symbol color | Note |
|---|---|---|
| Pergamino | Tinta | Default |
| Tinta | Pergamino | Dark surface |
| Azafrán | Tinta | Editorial use |
| Hueso | Tinta | Soft surface |
DO
- One piece of Azafrán per composition — a single underline, one word, one detail. "Una pieza de azafrán por composición — un subrayado, una palabra, un detalle."
- Pergamino is the default background. "Pergamino es el default — blanco puro solo si el contexto lo exige (pantalla, código)."
DON'T
- Keep every surface within the Aurea core. A matiz varies density, contrast, and emphasis — never the palette family. "Todo hace honor a Aurea; cambia el matiz, no la marca."
- The symbol is never in Azafrán. "El símbolo nunca va en azafrán — el azafrán acompaña al símbolo, no lo reemplaza." Azafrán accompanies the symbol; it never becomes the symbol.
- No "AI sparkle" / twinkle clichés. The brand never signals "AI" with a
4-point star or sparkle. The destello is the Azafrán seed/point (and the
.digitalof the wordmark), never a twinkle glyph. (Brand decision — 2026-06-05.)
7. Typography & wordmark
Fonts
| Use | Font | Notes |
|---|---|---|
| Display + body | Geist | Brand typeface |
| Eyebrows, specs, meta labels, numeric tags | Geist Mono | e.g. 04 · COLOR, n = 13 · Fibonacci |
| Fallback only | System Sans-Serif | If Geist is unavailable |
Geist Mono carries the "technical specimen" voice of the brand — page numbers, section labels, and the construction numerals all set in mono.
Wordmark — tuempresa.digital
| Property | Spec |
|---|---|
| Font | Geist Medium |
| Letter-spacing | -0.04em |
| Case | lowercase |
The . | Orthography, always kept — never dropped, never decorated |
tuempresa | rendered in Tinta |
.digital | rendered in Azafrán |
So the wordmark is: tuempresa (Tinta) + .digital (Azafrán), Geist Medium,
lowercase, tracked -0.04em. The .digital carries the brand's single accent —
which is exactly why the symbol itself never takes Azafrán (§6):
the accent already has a home.
Mark — symbol alone
The symbol-only asset (tuempresa.svg) is used for square contexts: app
icon, favicon, social avatars.
8. Lockups
The mark + wordmark combine two ways:
| Lockup | Where |
|---|---|
| Horizontal | Nav, email signature |
| Vertical | Hero, splash, covers |
Spacing between mark and wordmark = 0.5× the symbol diameter. This spacing
never changes (see §9).
9. Usage rules
The one rule: "El ángulo nunca cambia, el espaciado nunca cambia, el color es siempre el del fondo invertido."
Clear space
- x = ½ ∅ — clear space equals half the symbol diameter.
- "Nada se acerca más que eso — ni texto, ni borde, ni otro logo."
Minimum scales
| Size | Context |
|---|---|
| 16px | favicon |
| 32px | nav / social |
| 64px | avatar |
| 128px | app icon |
- "A 16px se mantiene legible — la densidad central sostiene la identidad."
- Below 16px, use only the first point (the center seed).
The DON'Ts
| # | Don't | Why |
|---|---|---|
| 1 | Don't deform | "El símbolo siempre cabe en un cuadrado. Estirar rompe la fórmula áurea." |
| 2 | Don't rotate statically | "El ángulo áureo ya determina la orientación. Solo se rota en animación, no en producto." |
| 3 | No outline | "Las semillas son sólidas, no anillos. La densidad del centro es la marca." |
| 4 | No app-icon container | "Ni squircle, ni fondo de color, ni gradient. El símbolo se sostiene desnudo." |
| 5 | No "AI sparkle" / twinkle | "La marca nunca señala 'IA' con una estrella de 4 puntas ni un destello. El destello es la semilla/punto Azafrán, nunca un brillito." (Brand decision — 2026-06-05.) |
10. Vision — the mark IS the product
"Lo que hoy es marca, mañana es producto."
The brand mark is a preview of the product. The same dense seed-field that is the logo renders, inside the product, as the Memoria view:
"A los 6 meses tu negocio tiene 377 hechos aprendidos. Esto es lo que se ve cuando abres 'Memoria' en el menú."
How the seed-field maps to memory
| Zone | What it represents | Copy |
|---|---|---|
| Center | The first fact | "El día que tu equipo conectó la primera app. Nunca se mueve." |
| Inner spirals | Rules and constants | "Comisiones, ciclos de cobro, vencimientos. Hechos que rara vez cambian." |
| Middle bands | Clients and deals | "Entidades vivas. Pueden moverse de estado, pero su lugar es estable." |
| Outer edge | What was just learned | "Conversaciones, follow-ups, decisiones de esta semana. Crece cada día." |
Interaction (Memoria view)
"Hover → muestra el hecho. Click → abre el thread. Filtrar por dominio → ilumina solo las semillas relevantes."
| Gesture | Result |
|---|---|
| Hover a seed | Shows the fact |
| Click a seed | Opens the thread |
| Filter by domain | Highlights only the relevant seeds |
Note on surfaces: when the seed-field renders inside the product (Memoria), it adopts the app surface's Aurea matiz and inverts to the surface color per §6. Brand and product share one core — the mark crosses from a landing page into the app with no palette translation. This is the bridge made literal: same core, same form, surface-appropriate matiz.