CSS to Show Required Field

If you would like to have the standard “red star” appear next to your field label as soon as the field is made required, add the CSS below to your form-wide client library. It will ensure that fields that are required will be marked as required prior to the user submitting the form and a validation error prevents them from the submit.

div[data-mandatory*="true"] label::after {
    content: " *";
    color: red;
    font-weight: bold;
    font-size: 2em;
}

Note that the use of red on the label alone shouldn’t be used as an indicator as a required field. The star is added to ensure that color impaired users can see the significance of the field without dependancy on color.