In this section, we will learn what the max attribute is and how to use it.

What is max Attribute in HTML <input> Tag?

<input> elements of type: number, range, date, datetime-local, month, time and week, take values within a range!

For example, by default, the range of an <input> element of type range is between 0 to 100. This means the maximum value that we can set for a range-field is 100!

But with the help of the max attribute, we can change this maximum value to whatever value we want.

For example, if there’s an <input> field of type date and we want to change the maximum to a year like 2050 which means the maximum year users can select is 2050, we can use the max attribute and set its value to “2050-01-01”.

HTML max Attribute in <input> Tag Syntax:

<input type = “type” max = “value”>

<input> Tag max Attribute Values

Depending on the type of the <input> element, these are the possible values for the max attribute:

Input Type	Value
number	Any positive or negative number.
range	Any positive or negative number.
date	Any date with the following format (all in number): year-month-day
datetime-local	Any date with time that matches the following format (all in number): year-month-dayTHour:Minute Example: 2000-01-01T18:00
month	Any date with the following format: year-month Example: 2020:01
time	Any time with the following format: hour:minute Example: 21:00
week	Any week with the following format: year-Wnumber Example: 2020-W18 which means the year 2020 and the week 18.

Example: using max attribute in HTML <input> tag

See the Pen using max attribute in HTML <input> tag by Omid Dehghan (@odehghan) on CodePen.

In this example, the input field is of type date and the maximum year for this field is set to 2025. This means users can’t pick a year above 2025.