Tokens
Los design tokens son variables básicas que se utilizan para mantener consistencia en un sistema de diseño. En Nimbus, se refieren a los colores, tipografías, espacios y otras propiedades básicas de diseño. Los tokens se utilizan para asegurar una apariencia y sensación uniformes a través de todos los componentes y aplicaciones.
Color
Los tokens de color se componen de 5 categorías: Primary, Success, Warning, Danger y Neutral. Cada una de ellas posee una paleta ampliada de 12 tonos, de los cuales 8 están vinculados a funciones definidas.
Leer documentaciónTypography
Nuestra tipografía es la CentraNube, una adaptación de la tipografía Centra creada especialmente para Tiendanube. Esta tipografía no es libre de derechos por lo que no podemos disponibilizarla junto con el Design System. Por eso, dentro del font-stack de Nimbus, agregamos algunas fuentes de fallback para que nuestros usuarios puedan tener una experiencia óptima.
Leer documentaciónBreakpoint
Nimbus tiene breakpoints definidos para que las interfaces construidas con él se adapten de forma responsiva, proporcionando una experiencia adecuada a través de diferentes tamaños de pantalla.
Leer documentaciónShadow
Los tokens de sombra de Nimbus se basan en niveles de distancia desde el fondo, cada uno de los cuales está vinculado a un conjunto diferente de propiedades para resaltar esa característica.
Leer documentaciónShape
Las formas de Nimbus se basan en múltiplos de 4px, generando escalas de radio que pueden variar según las necesidades de la interfaz.
Leer documentaciónSpacing
El espaciado de Nimbus se basa en una grid de 4px, generando escalas de espaciado que pueden variar según las necesidades de cada interfaz, estas escalas utilizan la unidad de medida rem, que en nuestro sistema equivale a 16px.
Leer documentaciónzIndex
Nimbus cuenta con valores de z-index predefinidos para facilitar la organización a la hora de apilar elementos en la pantalla, evitando así la superposición de componentes.
Leer documentación