transparencia-designv0.1
00 — Design system
A single design.md,
one cobalt accent,
no neon.
The TransparencIA design system as a markdown spec plus a live preview. Drop it into any project and your AI tooling stays on brand.
01 — Identity
Editorial newspaper, civic substance.
Restrained, Mexican, substantive. The page should feel like something a serious reader respects — not a SaaS dashboard.
- ×Stock-photo people or 3D blobs
- ×Neon gradients, glassmorphism
- ×Centered long body text
- ×"Platform" where "publication" fits
- ×Emoji in product surfaces
- ×Drop shadows beyond a soft ambient lift
02 — Color
One paper, one ink, one cobalt.
paper
#f4f1ec
Page background
paper-tint
#efebe3
UI chrome
ink
#0f172a
Headings
ink-soft
#1a202c
Body default
ink-mute
#475569
Secondary body
ink-faint
#64748b
Captions, meta
ink-ghost
#94a3b8
Tick marks, mono
rule
#cbd5e1
Borders, dividers
cobalt
#0f3bd6
Brand accent
cobalt-soft
#3b82f6
Interactive
cobalt-haze
#dbe4f7
Hero halos
terracotta
#e07a3c
Second accent (sparingly)
03 — Typography
Serif for weight, sans for everything else.
Display H1
Playfair Display · 72px
Una publicación cívica.
Section H2
Playfair Display · 48px
Tu mapa de actores y temas.
Body lede
Inter · 18px · 1.6
Crea proyectos para seguir a las personas, organizaciones y temas que te importan.
Kicker
ui-monospace · 10px · 0.3em
01 — Proyectos
Caption
Inter · 12px
Datos al 19 de mayo, 2026.
04 — Motifs
Architectural notation.
Grid paper
44px square grid · rgba(15,23,42,0.04)
Plus marks
Registration crosses · staggered blink
Accent squares
Cobalt + terracotta, paired
ENEFEBMARABRMAYJUNJULAGOSEPOCTNOVDIC
Month timeline
Mono ruler · cobalt marker
05 — Components
Browser frames, stat columns, live indicators.
transparencia.mx/app/analisis/proyectos
Noticias hoy
12,486
Tiempo real
Browser frame · live KPI overlay
12,486
Noticias
Artículos indexados en las últimas 24 horas.
521 / hr
3,201
Actores
Personas y organizaciones rastreadas.
847
Proyectos
Mapas de actores construidos por la comunidad.
Stat column · 3-up
06 — Imagery
Two registers: graphite and ink.
Register A: hand-drawn pencil renderings of Mexican civic landmarks. Register B: bold ink editorial illustration for atproto and federation pages. Don't mix them.
A detailed hand-drawn graphite pencil sketch of {SUBJECT —
a Mexican civic landmark}. Architectural precision, light
cross-hatching, restrained tonal shading, monochromatic grey
on white background. Transparent / pure white background.
Subject centered with generous negative space. Subtle warm
sepia tint. Small registration marks (cobalt blue and
terracotta orange squares, ~8px) scattered sparsely in the
negative space. Editorial, civic, serious — like a 19th-century
engraving redrawn for a newspaper. No color in the subject
itself. No people. No text.
Register A · LLM prompt