Feedback & Overlays
Trend Chip
A small pill showing a change, up or down, in seven icon styles.
Usage
12.4%2.1%
Installation
npm install @wunderui/reactThen import what you need:
import { TrendChip, TrendChipIcon } from "@wunderui/react"Examples
Up
A rising value.
12.4%
Down
A falling value.
2.1%
Icon
Seven ways to draw the direction; the same glyph turns for a falling value.
12.4%12.4%12.4%12.4%12.4%12.4%12.4%
12.4%12.4%12.4%12.4%12.4%12.4%12.4%
In context
How the component is used inside real screens — the same compositions as the Usage section of the Figma page.
Stat with trend chip
A value with its trend chip inside a stat card.