A form of range that expects the user to select from among discrete choices.

A spinbutton role is used when a range of options are available for the user to select from. To select an item from a number of options, a combo box can also be used, but a spin button helps to represent a large range.

Authors should ensure this functionality is accomplished programmatically through the use of up and down arrows on the keyboard. Usually the up-arrow key/ right arrow key increases the value while the down arrow key/ left arrow key decreases the value. Visibly, the current value is incremented or decremented until a maximum or minimum value is reached. 

It is better to provide an option to jump bulk numbers with a keyboard navigation key if the range is too high. If up-arrow key increases the value by one, a page-up key can increase the value by ten so that the user can quickly change the values when the numbers are high. Similar options can also be provided for decreasing the values. Home key can navigate the user to the first value in the range while the end key on the keyboard takes the user to the last value of the spin button.

Represent the minimum possible value by aria-valuemin, maximum value by aria-valuemax, while the current value is represented by aria-valuenow.

Although a spinbutton is similar in appearance to many presentations of select, it is advisable to use spinbutton when working with known ranges (especially in the case of large ranges) as opposed to distinct options. For example, a spinbutton representing a range from 1 to 1,000,000 would provide much better performance than a select widget representing the same values.