Roles semánticos
Función estable, valor cambiable.
Los roles del panel (Fondo, Texto, Primario…) exportan a tokens en inglés. Los componentes consumen el token; el HEX puede cambiar sin renombrar.
La misma interfaz, dos formas de nombrar
El layout no cambia. Solo cambia si el nombre describe función o apariencia.
Miniatura de producto
Título de sección
texto → on-background
Texto secundario en la superficie. El contraste se comprueba sobre el fondo real del componente.
¿Dudas? acento
primario → primary
Acción principal
La acción que quieres que encuentren primero. Si cambias el tono, el token sigue siendo primary.
Panel → export
- Fondo → background · Superficie → surface · Texto → on-background
- Primario → primary · Secundario → secondary · Acento → accent · Borde → border
- Derivados en export: on-primary, surface-elevated, success, warning, error, data-*…
Regla práctica
Si al cambiar el HEX tienes que renombrar el token, el nombre describía apariencia, no función.