Color · Rams / BraunA warm, restrained palette with a single Braun-orange accent.
09 tokens · 4 paletas
Fondo crema, tinta casi negra, acento naranja Braun. Todo lo demás son intermedios para escribir con ritmo. El color nunca decora: jerarquiza.Cream background, near-black ink, Braun-orange accent. Everything else is an intermediate step used to set rhythm.
Background--bg#EDE8DD
Background 2--bg-2#E4DFD2
Surface--surface#D9D3C3
Rule--rule#C9C3B2
Mute--fg-mute#8A8578
Accent 2--accent-2#6B6B6B
Dim--fg-dim#4A4740
Foreground--fg#111111
Accent--accent#D94E1F
Paletas alternas · data-palette
§ 02
Tipografía · Geist + Geist MonoA single sans + its mono — calm, neutral, contemporary.
2 familias · 7 niveles
Geist para todo lo que se lee; Geist Mono para metadatos, coordenadas y códigos. Un gesto técnico sutil sin caer en el cliché retro.
Geist Aa
FamiliaGeist Sans — VercelPesos usados
300 Light400 Reg500 Med600 Semi
UsoTítulos, lectura, UI
Geist Mono · 01
FamiliaGeist Mono — VercelPesos usados
400 Reg500 Med
UsoLabels, meta, coordenadas, kickers
Escala
Display · H1Diseño con IAclamp(56, 8vw, 120)
Title · H2Menos, pero mejor.48 / -0.025em
Subtitle · H3El brief es una conversación.34 / -0.02em
LeadUn cuaderno abierto sobre el oficio.28 / 1.2
Body · ReadEsta semana probé tres formatos distintos con el equipo de Ofelia Labs. El objetivo era simple: mantener la dirección sin matar la sorpresa.17 / 1.55
SmallEntrada N.º 047 · 08 min de lectura14 / fg-dim
Monolat 19.4326° · lng −99.1332°Geist Mono 12
Kicker§ 02 · JOURNAL / FIELD NOTES11 / .2em tracking
§ 03
Espacio · escala de 4A 4-based scale. Tight where it counts, generous where it breathes.
10 pasos
La escala vertical parte de 4 px y sigue múltiplos limpios. El grid base es de 12 columnas con gutter 24, margen 32.
--s-104 px
--s-208 px
--s-312 px
--s-416 px
--s-5 · gutter24 px
--s-6 · edge32 px
--s-748 px
--s-864 px
--s-980 px
--s-10120 px
§ 04
Motion · una sola curvaOne easing, three speeds. Movement should be felt, not watched.
3 duraciones
Todas las transiciones usan la misma curva cubic-bezier(.2,.7,.2,1). Cambia la duración, no la personalidad.
—d-1 · 150ms
Instantánea
Hover states, cambios de color, cursor feedback.
—d-2 · 250ms
Normal
Botones, tabs, entradas del índice, navegación.
—d-3 · 350ms
Lenta
Hovers sobre tarjetas, cambios de posición, reveals.
§ 05
Componentes · lo mínimo que construye todoA small vocabulary that composes every page.
2015 · 24Spartan GeekDiseño · MarketingE-commerceGaming9 años · líder↗
Section head.section-head · índice § + label ES/EN + aux
§ 02Journal/ Field Notes03 DE 47 ENTRADAS
§ 06
Marca · dos círculosSolid + outline. Tension between technology and craft.
Símbolo + lockup
Un círculo sólido naranja y uno de contorno: una forma tan antigua como un poster de jazz, tan moderna como cualquier app de 2026. Tensión, no decoración.
Símbolo · MARK
Lockup invertido
Manuel Fernández
§ 07
Principios · qué guía el sistemaWhat this system tries to be, and what it refuses to be.
05 + 05 no-objetivos
Sí / Yes
01Menos, pero mejor.
02El color jerarquiza. No decora.
03Grid visible, pero discreto — un plano técnico que se siente sin mirarse.
04Metadato en mono; lectura en sans. Sin excepciones.
05Cada elemento debe poder justificarse en una frase.