Delta
A change in a figure: a small triangle and the value, green going up, red going down.
Examples
Delta
+12.4%
−3.1%
0.0%
Anatomy
span.delta | The change as text, with the sign. The triangle is drawn before it. |
API
| Attribute | Values | Description |
|---|---|---|
data-trend | updownflat | Direction. up is success-coloured with the triangle pointing up, down danger-coloured and turned over, flat a muted bar. Without it the triangle points up in muted text. |
Accessibility
- Colour and triangle are visual only. Keep the sign in the text (
+12.4%,−3.1%) so the direction is announced. - The colour follows direction, not meaning: a falling churn rate still shows red. Say what improved in the surrounding label when that matters.