University of St Andrews

Buttons

Buttons are calls to action that are used to direct users to related pages.

Rules for buttons

• These buttons must be used only within main body of a page; they must not be used in asides.
• Buttons must not be used mid-sentence. They must always appear on their own line separated from written content.
• Buttons linking to downloadable content must use the icon button option.

Options available

• Primary button
• Secondary and tertiary buttons
• Label buttons
• Icon buttons

Primary button

Primary buttons are used on all pages with the primary blue palette theme.

Primary

Secondary and tertiary buttons

Secondary and tertiary buttons are used on pages currently using the secondary and tertiary palette themes.

Secondary
Tertiary 1
Tertiary 2
Tertiary 3

Label buttons

Label buttons must be used only on forms and other tasks that involve a user completing a task. For further information on the application of buttons in forms, see the form elements pattern.

Success
Info
Warning
Danger

Icon buttons

• An icon button must be used when the button action is to download a file.
• An associated font awesome icon to the downloadable file must be included in the button.

PDF document 
ZIP file 
Word document 
Powerpoint presentation