Small size
The small spinner is used where space is limited, for example, on input fields to indicate loading.
Large size
The larger loading spinner is used on page loads and larger screen takeovers. This will often be the only element on the page so it needs to be more prominent.
Coloured
The default colour is Navy. Some SDX components like Buttons or Dropdowns use a loading spinners to indicate a loading state and in this case the spinner inherits the colour of the parent component.
For example the colour of the loading spinner for a secondary button is Interaction Blue.