Core v1 · Foundations
Material estable, intención semántica.
JSON, CSS y Figma comparten nombres y significado. Los productos consumen roles; los valores físicos permanecen en la capa primitiva.
Contrato 0.4.16 · Especificado
Siete foundations con evidencia explícita.
La madurez se declara por entrada. Una variable existente o una captura aislada no convierten automáticamente una foundation en verificada.
Figma local4 colecciones, 116 variables, modos Dark/Light, 8 estilos de texto, 5 estilos de pintura de marca y 2 estilos de efecto.
BindingsSin aliases rotos, variables ALL_SCOPES ni sintaxis WEB ausente en la auditoría MCP del 23 de agosto de 2026.
PublicaciónImplementación local. No afirma librería Figma publicada, paquete distribuido ni consumidores actualizados.
Inventario contractual
Cobertura, razón y madurez.
| Foundation | Madurez | Razón | Evidencia |
|---|---|---|---|
Semantic color and Light/Dark modessemantic-color | Verificado | cross-scope | devsigner.xyz · ApexTrader · Hay Talks · NostrCity · UTXOPocket |
Editorial, UI and data typography rolestypography-roles | Verificado | cross-scope | devsigner.xyz · ApexTrader · Hay Talks · NostrCity · UTXOPocket |
Spacing, radius, border, elevation and motionspacing-geometry-motion | Verificado | cross-scope | devsigner.xyz · ApexTrader · Hay Talks · NostrCity · UTXOPocket |
Wide container and editorial reading measurelayout-measure | Verificado | cross-scope | devsigner.xyz · Hay Talks · NostrCity |
Compact, default and minimum touch control sizescontrol-sizing | Verificado | cross-scope | ApexTrader · Hay Talks · NostrCity · UTXOPocket |
Focus ring, disabled opacity and overlay scriminteraction-state | Especificado | accessibility-invariant | devsigner.xyz · ApexTrader · Hay Talks · NostrCity · UTXOPocket |
Document, application and data densitydensity | Especificado | cross-scope | devsigner.xyz · ApexTrader · Hay Talks · NostrCity · UTXOPocket |
Familias portables
Cada medida tiene una responsabilidad.
Los componentes deben enlazar estas familias antes de introducir un token local. Una excepción se documenta cuando la geometría es deliberadamente fija.
| Familia | Tokens | Uso |
|---|---|---|
| Color semántico | --ds-canvas · --ds-surface-* · --ds-text-* · --ds-border-* | Roles Light/Dark para estructura, lectura y separación. |
| Marca y acciones | --ds-brand-* · --ds-action-* | Primary y Secondary son intención; terracotta y cream permanecen como materiales primitivos. |
| Expresión de marca | --ds-brand-atmosphere · --ds-brand-material-* | Gradientes cálidos y glifos editoriales; nunca sustituyen Surface, estados o iconos funcionales. |
| Estados funcionales | --ds-status-success|danger|warning|info | Texto y superficies suaves independientes del color de marca. |
| Medida | --ds-content-wide-max · --ds-content-reading-max | 1216 px para composición amplia y 704 px para lectura editorial. |
| Controles e iconos | --ds-control-* · --ds-icon-size-* | Alturas compact/default, objetivo táctil de 44 px e iconos de 16/20/24 px. |
| Interacción | --ds-focus-* · --ds-opacity-* · --ds-density-* | Foco visible, disabled, scrim y densidades portables. |
| Forma y ritmo | --ds-space-* · --ds-radius-* · --ds-border-width | Escalas comunes sin medidas locales arbitrarias. |
| Motion y elevación | --ds-duration-* · --ds-ease-standard · --ds-shadow-* | Feedback breve y profundidad reservada a jerarquía real. |
Modos y límites
Light y Dark cambian el material, no la intención.
Roles semánticos
canvas, surface, texto, bordes, acciones y estados resuelven aliases distintos por modo. Los componentes no eligen un hexadecimal según el tema.
Primitivos de marca
terracotta, cream y los colores de las formas pueden conservar nombres físicos porque describen material. No aparecen como API de producto.
Tipografía
Display 0 %, H1 +0,25 % y H2/H3 +0,5 %. El ajuste es contractual en JSON, CSS y estilos Figma.
Accesibilidad
Foco, objetivo táctil, contraste y estados funcionales no son preferencias de marca; son invariantes del Core.
Brand toolkit · Extensión editorial
Atmósfera, material y glifos tienen responsabilidades distintas.
Estas recetas proceden de composiciones reales de devsigner.xyz. Se documentan en el sistema maestro, pero no entran en el Core transversal ni convierten un producto en una escena de marca.
AtmosphereProfundidad de baja opacidad para fondos narrativos; cambia con Light/Dark.
DiscoveryCírculo dominante + cuadrado de apoyo.
DefinitionCuadrado dominante + triángulo de apoyo.
RoadmapTriángulo dominante + dos apoyos.
MetricsCírculo dominante + dos apoyos.
No son iconos funcionales
Por defecto se ocultan a tecnología asistiva. Nunca nombran por sí solos un botón, estado o destino.
Excepción de display
Blur y sombra marcada solo se admiten dentro de una ilustración narrativa. Las superficies de interfaz siguen usando los tokens de Surface y elevación.