Back to the pattern library

Submit

Make submit buttons:

  • descriptive of what they’re doing, for example, ‘send order’
  • available only at the end of your form
  • the primary button on the page

More detailed information on how to use form patterns can be found in our design guidance.

Example

Example

HTML

<button type="submit" class="coop-btn coop-btn--primary">Continue to booking</button>

SCSS

The styles for this pattern can be found in the foundations on github.

JS

There is no javascript needed for this component.

Design and content

Submit buttons have the same styling as the primary button.

Accessibility

We are currently working on this.

For more information see our general guide on accessibility.

Suggest a pattern

Use this form to suggest a new pattern or a change to an existing one.

Suggest a new pattern or a change