Change Back and Next Buttons in Different Colours

Is there code that I can use to make the 'back' and 'next' buttons different colours?

You can change that if you go to Form Designer button see image 1, and then another window will open, you can find properties about next and previous button.

lumiardian's guide is for the new form layout.

Since you are using the standard form's layout, you can use the following CSS codes and inject it into your form to change the next and back buttons color.

.form-pagebreak-next {

    background-color: #00a0f0 !important;

    border-color: #00a0f0 !important;

}

.form-pagebreak-back {

    background-color: #00a0f0 !important;

    border-color: #00a0f0 !important;

}

If you wish to change the background colors on mouse focus, add this.

.form-pagebreak-next:hover {

    background: #54a2f9 !important;

    border-color: #54a2f9 !important;

}

.form-pagebreak-back:hover {

    background: #54a2f9 !important;

    border-color: #54a2f9 !important;

}

The next and back text in bold is your hint on which button is it for.

If you want to change the colors, you can replace the hex color codes e.g. #00a0f0.

The above code gives you the following result.

If you need further assistance, please let us know.

Thank you so much both of you. 
The code has worked perfectly.

Becca