1. Add the **Native Spinners** element to your mobile page.
2. Choose the **Spinner type** you want to display.

3. Set the **Size** field to control how large the spinner appears.

4. Set the **Color** field to control the spinner color.

5. Adjust the **Animation speed** field to control how fast or slow the spinner animates.

6. Use Bubble conditions to show or hide the spinner:
  - Show it while data is loading.
  - Show it while an API workflow is running.
  - Show it while a file is uploading.
  - Show it while payment or authentication is processing.
  - Hide it when the process is complete.

7. For button loading states, place the spinner inside or beside the button and use a smaller size.

8. For full-page loading states, center the spinner in the page or container and use a larger size.

9. For best results:
  - Avoid placing too many animated spinners on one screen at the same time.
  - Use one clear loading indicator for each loading area.
  - Keep spinner colors visible against the background.
  - Use conditions to prevent the spinner from showing after the task is complete.