Primitive

Delta

Compact change indicator using terminal, error, or neutral ink.

Delta is a numeric modifier. Keep the value concise and include basis only when the comparison would otherwise be unclear.
data
DeltaDefault
+18.6%-2.4%0.0%

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

Positive, negative, and neutral deltas.
+18.6%-2.4%0.0%

Basis

Deltas with comparison basis labels.
+18.6%vs last week-2.4%over budget0.0%unchanged

Density

Delta density scale for metric lockups.
+4.2%+9.8%+18.6%+24.1%

Wash

Soft filled delta treatment.
+18.6%-2.4%0.0%

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription
value *string-Formatted delta text.
intent'positive' | 'negative' | 'neutral'neutralTerminal, error, or neutral ink treatment.
density'compact' | 'comfortable' | 'editorial' | 'display'comfortableDelta type and icon rhythm.
hierarchy'plain' | 'wash'plainPlain inline delta or soft tinted chip.
basisReactNode-Optional comparison basis text.