Change colour of error messages

This is something we’d like to know as well. Currently, when an error is detected (for example no @ symbol in email address) we get the message ‘One of more fields have an error. Please check and try again’. This is displayed in a yellow/gold coloured box with an exclamation mark in front. The colour is not part of our brand and we would like to style it so that it closer matches our brand.

To make any styling changes to the form including the styling of the error messages of the form you would need to use CSS.

You are able to make these changes via a Custom CSS plugin such as Simple Custom CSS or a Child theme.

For example to change the color of the validation error to a light blue you would put in the following css:

div.wpcf7-validation-errors {
border: 2px solid #f7e700;
color: #428bca;
}

See Styling Contact Form 7 Forms for a general explanation of styling CF7 forms using CSS.