Sistema de Alertas UI

Componente de alertas reutilizable diseñado para comunicar estados del sistema de forma clara, accesible y escalable.

Problema que resuelve

En muchos proyectos, las alertas terminan siendo componentes inconsistentes, difíciles de mantener o poco accesibles. Este diseño busca unificar criterios visuales y técnicos.

Decisiones de diseño

• Colores semánticos (success, warning, error, info)
• Íconos como refuerzo visual, no decorativo
• Contraste suficiente para dark mode
• Animaciones sutiles, no intrusivas

Estructura del componente

Diseño final

Tips personales

• ✔ Siempre define un sistema de estados antes de diseñar
• ✔ Usa variantes, no componentes distintos
• ✔ Evita colores saturados para mensajes persistentes