Design tokens
Los design tokens representan decisiones de diseño mediante valores con nombre, como colores, espacios o tipografías
Qué significa, cómo se usa y en qué contexto aparece, con sus conceptos relacionados.
Qué es y cómo funciona
Permiten compartir y actualizar criterios entre herramientas y código. Su estructura puede incluir niveles semánticos, como un color para estados de error. Su utilidad depende de nombres claros, documentación y un proceso de mantenimiento coherente.
Variantes y conceptos vinculados
- Color de error. Un token semántico de error identifica un uso, no solo un color. La información de error también necesita señales distintas del color.
- Color de fondo. El color de fondo puede representarse mediante un token semántico para mantener coherencia y facilitar cambios de tema.
- Color de superficie. El color de superficie identifica capas o contenedores. Sus relaciones deben mantener contraste y jerarquía.
- Color primario. El color primario tiene un papel definido en el sistema. Su significado debe documentarse y no asumirse universal.
- Color secundario. Los colores secundarios complementan la paleta con funciones concretas y deben comprobarse en combinación con otros elementos.
- Colores 'on'. Los colores de contenido sobre superficies necesitan contraste suficiente. Un nombre de token puede expresar esa relación de uso.
- Colores alternativos. Las variantes de color deben responder a estados o contextos documentados, evitando proliferación de valores sin función clara.
Preguntas frecuentes sobre Design tokens
¿Cómo cambiar un design token sin romper las interfaces que lo utilizan?
Identifica dónde se consume y qué función representa. Un token semántico, como texto principal, permite revisar la intención; uno llamado por su color solo describe un valor. Prueba el cambio en componentes, estados y temas antes de extenderlo. Si cambia el significado, puede necesitar un token nuevo y una retirada gradual del anterior. Renombrar o sustituir valores sin conocer sus usos puede generar combinaciones incoherentes aunque la biblioteca siga compilando.