Forms
Number Stepper
A +/- increment control for a bounded numeric value.
Usage
3
Installation
npm install @wunderui/reactThen import what you need:
import { NumberStepper } from "@wunderui/react"Examples
Quantity
Minus and plus around the value.
3
In context
How the component is used inside real screens — the same compositions as the Usage section of the Figma page.
Display settings
A segmented control, a switch and a number stepper in a settings section.
Display
Density
Compact reduces padding in tables and lists.
Reduce motion
Minimize animations and transitions.
Font size
Scale interface text.
100
Add seats
Change the number of seats and see the price update.
Mini cart
Change quantities per item in a slide-over cart.
Your cart
Nord standing desk€649
1
Halo desk lamp€89
2
Subtotal€827
New column form
A text field, a color picker and a limit stepper to create a board column.
New column
5