Number input
The number input component is used for entering numeric values and includes controls for incrementally increasing or decreasing the value.
Overview
Number inputs are similar to text inputs, but contain controls used to increase or decrease an incremental value.
Live demo
Optional helper text.
Formatting
- Do not use number inputs when large value changes are expected. They work best for making small, incremental changes that require only a few clicks.
- Enable the user to also choose to type a number in the field.
- Ensure that a default value is shown within the field.
- Use a clear and concise label for the number input.
- Use sentence-style capitalization (only the first word in a phrase and any proper nouns capitalized) for the label.
- See further guidance for using number labels within forms.
Feedback
Help us improve this component by providing feedback, asking questions, and leaving any other comments on GitHub.