Web Pattern Library

Github Repo


Global styles

Global components

Template Structure

Bag, Wishlist, & Checkout

Home / Login

Marketing Modules

Product Listing & Detail

Size & Fit Guides


My Account / History

Static pages

JavaScript Helpers

Web Pattern Library:

Error messages

Related: Form elements

Form-level error feedback

When an error message applies to the entire form, prepend <p class="form-invalid"> to the form-group-wrapper container.

Sorry, this order number and zip code combination does not match our records. Please try again.

Required Field

Inline error feedback

For individual field errors, add the invalid class to the form-group container.