Consultoría AI-native · Código de marca visual

La marca que un agente puede ver.

Le diste a tu marca una voz que la IA puede hablar. Ahora necesita una cara que la IA pueda ejecutar. Se llama DESIGN.md — el formato abierto que Google convirtió en estándar — y es la otra mitad de tu código de marca. Nosotros lo construimos.

Apache 2.0 · estándar abierto · W3C Design Tokens · compatible con Claude Code · Cursor · v0
DEFINICIÓN

DESIGN.md es un archivo Markdown que combina tokens de diseño legibles por máquina con el razonamiento de diseño en prosa, para que cualquier agente de IA genere interfaces y piezas fieles a tu marca — con validación de accesibilidad incluida.

15.800★
en GitHub en semanas — no es moda, es infraestructura.
github.com/google/design.md
9 reglas
el linter valida estructura y mide contraste WCAG solo.
npx @google/design.md lint
25%
de la búsqueda se desplaza a respuestas de IA en 2026.
Gartner · 2024
01 · EL DIAGNÓSTICO

Tu IA está improvisando tu azul. Cada día.

Cuando le pides a un agente que genere una landing, 20 anuncios o una plantilla, necesita tu color exacto, tu tipografía, tu escala y tu radio. Hoy eso vive en un PDF de 80 páginas, en un Figma que la máquina no abre o en la cabeza de tu diseñadora.

Así que improvisa: un azul que casi es el tuyo, una tipografía genérica, el acento donde nunca debería ir. Es la deriva visual, y a escala de IA ocurre en cada generación.

El manual clásico no lo arregla: está escrito para que un humano lo interprete. Un agente no interpreta, ejecuta.

02 · EL FORMATO

DESIGN.md: tu sistema visual, en una capa que la máquina ejecuta.

Archivo Markdown junto al código, versionado en Git, con dos capas: tokens (YAML, valores exactos) y razonamiento (cuándo usar cada decisión y cuándo no).

Un token no es una variable, es una decisión. blue le dice a la IA qué es; primary le dice qué hace.

Compatible con W3C Design Tokens (DTCG) y exportable a CSS, Tailwind o el formato que use tu stack.

---
name: "MAIN MIND v3"
tokens:
color:
paper: "#FAFAF5"
ink: "#23262E"
primary: "#0045EA"
typography:
display: "Poppins 900"
body: "Inter 400"
rounded:
pill: "999px"
---
# Botón primario
Usa {colors.primary} sobre {colors.paper}.
Radio: {rounded.pill}. Texto: {typography.body}.
03 · EL TRUCO

Tu marca, por primera vez, tiene un linter.

DESIGN.md trae un CLI que valida tu identidad como código.

# validar estructura + contraste WCAG
$ npx @google/design.md lint DESIGN.md
# detectar regresiones entre versiones
$ npx @google/design.md diff v2.md v3.md
# export a estándar
$ npx @google/design.md export --format dtcg | css | tailwind
contrast-ratio
WCAG AA · 4.5:1 en cuerpo de texto.
missing-primary
Token semántico sin valor base asignado.
orphaned-tokens
Tokens declarados que nadie usa en el sistema.
broken-ref
Referencias {colors.x} que apuntan a tokens inexistentes.

Tu identidad visual pasa a tener control de versiones, test de regresión y export a estándar.

04 · LA TESIS +MAIN.MIND

DESIGN.md es la otra mitad de ETHOS.

LA VOZ · CODEX ETHOS
Lo que dice y cómo suena.

Tono, vocabulario, fronteras semánticas y reglas de razonamiento que cualquier agente lee antes de escribir una sola palabra de tu marca.

+
LA CARA · DESIGN.MD
Cómo se ve al decirlo.

Tokens, escala, ritmo visual y reglas de uso para que la misma marca aparezca, idéntica, en cualquier pieza que la IA genere.

Sin la voz, escribe genérico. Sin la cara, diseña genérico. Con las dos, el agente ES tu marca. Nuestro Design System v3 ya funciona así.

05 · EL MÉTODO

Las cinco decisiones que codifican tu marca.

01
Auditoría de tokens
Extraemos color, tipografía, escala, espaciado y radios desde tu manual, tu Figma y tu producto. Resolvemos contradicciones.
02
Razonamiento e intención (con frontera)
Escribimos en prosa cuándo usar cada token y cuándo no. La frontera es la parte que un PDF nunca tuvo.
03
Componentes y estados
Definimos los patrones que la IA va a generar: botones, cards, secciones, jerarquías y estados (hover, foco, error).
04
Validación
Pasamos el linter, garantizamos contraste WCAG AA y verificamos que no quedan tokens huérfanos ni referencias rotas.
05
Activación en tus agentes + conexión con ETHOS
Conectamos DESIGN.md con Claude Code, Cursor o el agente que uses. Si tienes ETHOS, los enlazamos. Si no, te lo escribimos.
ECOSISTEMA

Ya hay ecosistema · no lo escribes a mano.

DESIGN.md Generator
Plugin oficial para Figma que extrae tokens y estados a DESIGN.md.
Token Bridge
Sincroniza Figma con Claude / agentes en tiempo de generación.
design-md-figma
Open source · base para integrar el formato en cualquier flujo.
Tokens Studio / W3C DTCG
Compatibilidad con el estándar de tokens de diseño del W3C.
INFORME GRATUITO · 2026

El manual de marca ha muerto en 2D.

La guía completa de DESIGN.md: anatomía de la spec, el linter de 9 reglas, el método de las cinco decisiones, el ecosistema y una plantilla lista para usar.

📄 15 páginas maquetadas🧩 Plantilla DESIGN.md✅ Linter explicado🔗 Conexión con ETHOS
Quiero el informe →
EL DIAGNÓSTICO

¿Tu marca está lista para que un agente la dibuje?

Déjanos tus datos y te enviamos el informe al instante. Si quieres, miramos tu marca, le pasamos el linter y te decimos en una semana qué está listo para codificarse y qué no.

  • PDF de 15 páginas en español
  • Plantilla DESIGN.md lista para tu marca
  • Linter explicado regla a regla
  • Sin spam, sin compartir tus datos
🔒 Tus datos están seguros. Responsable: MAIN MIND · hola@mainmind.es
08 · PREGUNTAS

Lo que más nos preguntan.

Un archivo Markdown que combina tokens de diseño legibles por máquina con el razonamiento de diseño en prosa, para que cualquier agente de IA genere interfaces y piezas fieles a tu marca — con validación de accesibilidad incluida.