Helpers

Link a Figma

Tooltip

Indicadores o información. Aparecen a través de un hover, se suele usar para indicar la acción que ejecutará un botón. Muestran información adicional al hacer clic, pasar el mouse o enfocarse. La información debe ser contextual, útil y no esencial.

 

 

 

Chip

Los “Chips” son pequeñas etiquetas, pueden ser usadas como filtros clickeables o como identificadores y clasificadores. Utilice etiquetas cortas para escanear fácilmente. Utilice dos palabras solo si es necesario para describir el estado y diferenciarlo de otras etiquetas.

 

Divider

El componente Divider es utilizado como un separador, ayuda a crear jerarquía y separar visualmente espacios.

Scrollbar

El componente Scroll Bar es utilizado para desplazar la pantalla en el dispositivo, puede ser utilizado tanto verticalmente como horizontalmente.

 


 

Loading

 

Progreso

 

 

Todos los componentes han sido diseñados para trabajar armoniosamente juntos, como partes de un todo mayor. Es por esto que cada componente deber ser integrado y construido siguiendo nuestros lineamientos de usabilidad y guías de construcción. Toda esta información se encuentra en la página Lineamientos de construcción de nuestro sistema de diseño. Además se debe tener en consideración la accesibilidad en el uso de la tipografía y la accesibilidad del color.