Chip

Descripción general

Los chips son elementos interactivos y compactos que permiten a los usuarios filtrar el contenido que se encuentra debajo de ellos o activar acciones rápidas. Los componentes compactos ayudan a optimizar la finalización de tareas en la ruta, ya que presentan opciones contextuales relevantes para el contenido y reducen el tiempo de navegación.

Para mantener la claridad visual, los diseños deben limitarse a un máximo de 7 chips por fila. Los chips son muy flexibles para que coincidan con el lenguaje visual de tu marca. Puedes personalizar la forma, el color de fondo y el color del borde según el tema de la IU elegido.

Los chips pueden contener lo siguiente:

• Solo un ícono
• Solo una etiqueta de texto
• Un ícono y una etiqueta (en cualquier dirección)

---

Composición

---

Requisitos de UX

Para garantizar una experiencia segura y coherente en todas las apps, sigue estos requisitos de diseño:

Nivel de exigencia	Contenido
OBLIGATORIO	Incluye un ícono o una etiqueta.
OPCIONAL	Usa un estilo visual único, como un color o una forma distintos, para comunicar diferentes estados de chip.
OPCIONAL	Implementa un estilo coherente en todos los chips de tu app.
OPCIONAL	Evita mezclar chips con estado y sin estado dentro del mismo grupo de componentes.
OPCIONAL	Coloca los chips críticos o recomendados en el borde principal del contenedor.
OPCIONAL	Mantén el texto de la etiqueta breve y descriptivo. Evita el texto largo que activa el truncamiento y aumenta la carga cognitiva.