Primitive

Pill

Quiet inline metadata label.

Pills are passive metadata. Use them for short labels and status context, not for commands or high-emphasis alerts.
status
DOM renderImage render
PillDefault
inkqueuedpointer

Playground

Controls update query params directly, so every primitive state can be linked, rendered, and screenshotted deterministically.

Loading playground

Rendered matrix

Every state maps to the same primitive render route through the state query param.

Default

Quiet metadata pills.
inkqueuedpointer
Render state

Signals

Signal tone pills.
liveproblocked
Render state

Icons

Pills with leading glyphs.
memogeneratedrunning
Render state

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription
intent'neutral' | 'strong' | 'subtle' | 'sky' | 'terminal' | 'ultra' | 'danger'neutralInline label intent or quiet signal wash.
leadingIconIconName | ReactElement-Optional leading glyph.
childrenReactNode-Pill label.