Number input β
Number input lets the user enter a number.
When to use β
- To let users input incremental numbers.
When not to use β
- If the value consist of numbers, but this numbers are not incremental (e.g. telephone or credit cards numbers).
Usage guidelines β
Specifications β
Number input automatically invalidates any entry that isn't a number (or empty, unless βrequiredβ is specified). A set of up and down buttons to step the value up and down is usually displayed by default.
You can set a
min
andmax
value the field can have.The increment by default is one, but you can set the
step
attribute to constrain valid values to a certain set of steps (e.g., multiples of 10).Decimals can be optionally displayed. Note that some countries use β,β and some others use β.β to separate decimals. This will depend on system locale.
If needed, you can include units (km, gb, etc...). The unit can be displayed either in long, short, or narrow format. Note that pluralization is integrated.
Other accessibility specifications are handled by the native component.
For detailed information about Number input, read <input type="number"/>