Pill Badge

DESIGN RATIONALE

A compact status indicator using a pill shape with high border-radius. Four semantic variants: neutral (slate), success (green), warning (amber), and error (red). Each variant uses a desaturated background at 10% opacity with a saturated text color. The badge never exceeds 120px in width; longer labels truncate with ellipsis.

USAGE GUIDELINES

Use inline next to table rows, list items, or card headers to indicate status. Also effective inside filters and segmented controls.