Foundations/Badge
Badge
Indicadores pequeños de estado y etiquetas. Usálos para comunicar estado, categoría o metadatos de un vistazo. Construido sobre una sola prop de variante — sin configuración adicional.
Variantes de Marca
Paleta de marca principal — default (verde), secondary (arena), tertiary (naranja ladrillo), quaternary (azul intenso).
Default
Secondary
Tertiary
Quaternary
Outline
Destructive
Variantes Semánticas
Comunicá el estado de un vistazo. Usá estas variantes para indicar éxito, advertencia, error e información de forma consistente en toda la app.
Success
Warning
Error
Info
Todas las Variantes
Referencia rápida — cada variante disponible renderizada en paralelo.
Default
Secondary
Tertiary
Quaternary
Outline
Destructive
Success
Warning
Error
Info
Uso Real
Cómo aparecen los badges en contexto — junto a texto, dentro de tarjetas o como etiquetas de estado en tablas.
Estado del componente
Estable
Estado del componente
En Progreso
Estado del componente
Planificado
Borrador
Pendiente revisión
Aprobado
Rechazado
Contenido Personalizado
Los badges aceptan cualquier children — números, etiquetas cortas, o incluso indicadores de punto.
New
99+
Beta
v2.4.1
Live