Some input types, such as type="number" and type="date" allow you to set minimum and maximum values using the min and max attributes, for example:

<input type="number" min="1" max="100" />

<input type="date" min="2025-01-01" max="2025-01-31" />

Setting the min and max values will help prevent users from selecting values outside of the specified range, but they can still manually enter any value.

Additionally, we can use :in-range to style an element, with the styles only applying if the value is within the specified range.

See the Pen :in-range by Kevin (@kevinpowell) on CodePen.