GOV.UK elements Buttons

Use buttons to move though a transaction. Aim to use only one button per page.


Button text

Button text should be short and describe the action the button performs.

    <button class="button" type="submit">Save and continue</button>


Start now button

Launch your service with a Start now button.

    <a class="button button-start" href="#" role="button">Start now</a>


Button alignment

Align the primary action button to the left edge of your form, in the user’s line of sight.

Disabled buttons

    <button class="button" type="submit" disabled="disabled" aria-disabled="true">Save and continue</button>


Creating buttons

Use the GOV.UK Sass button mixin – find this in the GOV.UK frontend toolkit buttons.scss file.


  • #00823B
  • $button-colour


  • #FFBF47
  • $focus-colour

Discuss navigation buttons on Dropbox Paper