Tag Badge

A colourful gallery of outlined category label badges — each fully-rounded pill has a transparent fill with an accent-tinted border, a leading Tabler icon, and an accent-coloured label, plus a row of icon-only mini badges. Every badge is individually selectable with a fill-on-select effect.

A harbor-signal badge board in four hairline-ruled groups — dot status pills, counted label chips, priority meters, and solid release badges. Every badge is removable: it exits with a scale fade while survivors glide into place via FLIP, with localStorage persistence and a restore control.

A freight-tag label badge board in five labeled groups — chamfered tag plates in tint, frame, solid, tally, and icon-mark styles with mono count chips, selectable check-morph badges, a live summary, inline add and remove with localStorage persistence, keyboard navigation, and skeleton loading.

A pill button with a primary-color gradient circle badge that inverts on hover with a diagonal arrow slide animation — pure CSS transitions, no keyframes required.