forms contract
NumberInput
Numeric input with steppers. For quantities, ages, durations.
Variants
- default
- Steppers on the right
- compact
- No visible steppers, keyboard-only — table cells
- currency
- Leading currency symbol + thousands separator
Sizes
- sm
- 28pt
- md
- 36pt
- lg
- 44pt
Example
<NumberInput name="quantity" min={1} max={99} step={1} inputMode="numeric" />Usage rule
inputMode="numeric" or "decimal" — surfaces the numeric keypad on iOS/Android.
The full NumberInput contract has 4 more rules and 1 more example, plus the do-not patterns. Get the full recipe.