CSS :required pseudo-class

The :required pseudo-class targets inputs that have the required HTML attribute.

Instead of relying on the traditional asterisk * on the labels to denote “required”, we can also style required fields with CSS. Basically, the best of both worlds.

In the following example, this input has the required HTML attribute. The UX can be enhanced by applying a particular styling to provide a visual cue to the field is, well, required :)

Try submitting the form without filling any field.

All fields are required unless marked as "optional".