Numeric Stepper - Input

A numeric stepper is an input element that lets users adjust numeric values using an input field or buttons.

Overview

The purpose of numeric steppers with an input field is to provide users with flexibility in inputting numeric values.

Numeric steppers [input] include a text input field, allowing for precise value entry through the text input while also offering the convenience of incremental adjustments using the provided buttons.

A numeric stepper with an input between the controls.

Resources

Figma Component	Available
Figma Documentation	Available
Web Components	Planned
Vue [Fozzie]	N/A
React [Snacks]	Available
iOS JustUI [UI Kit]	N/A
iOS PIE [SwiftUI]	N/A
Android [XML views]	TBC
Android [Jetpack compose]	TBC