:required

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

The :required CSS pseudo-class represents any <input>, <select>, or <textarea> element that has the required attribute set on it.

Try it

This pseudo-class is useful for highlighting fields that must have valid data before a form can be submitted.

Note: The :optional pseudo-class selects optional form fields.

Syntax

css
:required {
  /* ... */
}

Accessibility

Mandatory <input>s should have the required attribute applied to them. This will ensure that people navigating with the aid of assistive technology such as a screen reader will be able to understand which inputs need valid content to ensure a successful submission.

If the form also contains optional inputs, required inputs should be indicated visually using a treatment that does not rely solely on color to convey meaning. Typically, descriptive text and/or an icon are used.

Examples

The required field has a red border

HTML

html
<form>
  <div class="field">
    <label for="url_input">Enter a URL:</label>
    <input type="url" id="url_input" />
  </div>

  <div class="field">
    <label for="email_input">Enter an email address:</label>
    <input type="email" id="email_input" required />
  </div>
</form>

CSS

css
label {
  display: block;
  margin: 1px;
  padding: 1px;
}

.field {
  margin: 1px;
  padding: 1px;
}

input:required {
  border-color: #800000;
  border-width: 3px;
}

input:required:invalid {
  border-color: #c00000;
}

Result

Specifications

Specification
HTML Standard
# selector-required
Selectors Level 4
# required-pseudo

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
:required

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

See also