Error states are activated when a user makes a mistake or something in the interface fails to work. These are particularly useful in forms when a user either enters invalid data or misses a required field. Error messages associated with error states should be polite and unobtrusive, but also clearly state the problem. Using a shade of red (not too bright) or some other contrasting colors and soft shadows around the problem area works perfectly.

Include inline error messages in real-time rather than error messages only triggered when the user submits a form. It’s less frustrating for the user and saves them time and effort.