This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
The pattern property of the HTMLInputElement interface represents a regular expression a non-null <input> value should match. It reflects the <input> element's pattern attribute.
The pattern property is valid for text, search, url, tel, email, and password types. It defines a regular expression that the input's value must match in order for the value to pass constraint validation.
If a non-null value doesn't conform to the constraints set by the pattern value, the ValidityState object's read-only patternMismatch property will be true.
A string.
const inputElement = document.getElementById("year");
console.log(input.pattern);
| Specification |
|---|
| HTML> # dom-input-pattern> |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
pattern |
4 | 12 | 4 | ≤12.1 | 5 | 18 | 4 | ≤12.1 | 4 | 1.0 | 4.4 | 4 |
<input>HTMLInputElement.value:valid and :invalid pseudo-classes
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/pattern