How do you modify the default validation message styles in Blazor?

You can use the following CSS classes to apply your own styles to validation messages.

CSS class name	Added DOM element
valid/invalid	Added to the <input> element of DOM
validation-errors	Added to the dynamically created <ul> element while using the <ValidationSummary> tag
validation-message	Added to the dynamically created <div> / <li> element which holds to error message.  <div> – created while using <ValidationMessage> tag  <li> – created while using <ValidationSummary> tag
modified	Added to the <input> element after modifying the default value.