# Mark Required Form Fields With an Asterisk

> Adds a red asterisk after the label of every required field in standard HTML forms, so visitors can see at a glance what they must fill in.

- Type: CSS
- Runs: Site-wide header
- Category: [Forms](https://wpide.com/library/category/forms/)
- Tags: forms, accessibility, css
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/form-required-asterisk/

## Code

```css
form label:not(:has(.required)):has(+ input[required])::after,
form label:not(:has(.required)):has(+ select[required])::after,
form label:not(:has(.required)):has(+ textarea[required])::after {
    content: " *";
    color: #c62828;
    font-weight: 700;
}
```

## Notes

Applies when the label sits directly before a field with the required attribute; labels that already contain a .required marker (like the comment form) are skipped.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Mark Required Form Fields With an Asterisk" in its snippet library and add it in one click; or create a new CSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/