Componentes · Atomic Design
Átomos
Los elementos indivisibles de la interfaz, construidos sobre los tokens. Cada uno declara su contrato (props, variantes, estados). Combinarlos produce moléculas (Capa 3).
Button
variant primary · secondary · tertiary — size sm · md · lg — disabled, block, slots start/end
Chip
tone neutral · accent · success · warning · error — variant soft · outline — dot
Análisis Alto rendimiento Completado En progreso Bajo
Neutral Accent Success
Badge
tone accent · neutral · success · warning · error — dot (estado sin número)
3 12 +5 ! 99+
estado con punto
Input · Label
Input: size sm · md — estados default · focus · invalid · disabled. Label: for, required, tone.
Link
variant default · accent · muted — external (target + rel seguro)
Divider
orientation horizontal · vertical — tone subtle · default · strong
Rendimiento
Posesión
Pases
Posesión
Pases