> For the complete documentation index, see [llms.txt](https://nextsky.gitbook.io/purity-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nextsky.gitbook.io/purity-theme/theme-settings/animation.md).

# Animation

**Animation** on websites adds motion and engagement. It attracts attention, increases interaction, and enhances user experiences.

<figure><img src="https://1059363070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRcDJSoM26kdEZlVFekVW%2Fuploads%2FOwmDRUi2Ya31YzB1IIZP%2Fimage.png?alt=media&amp;token=6c9d3768-5061-4830-9df4-2b3312da107b" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Scroll animation</strong></td><td>There are 3 options: <strong>disable</strong>, <strong>all screens</strong>, <strong>desktop only</strong>.</td></tr><tr><td><strong>Enable image lazy loading</strong></td><td>Improve page speed by delaying the loading of images until they are about to appear on screen.</td></tr></tbody></table>

**Page loading effect**

<figure><img src="https://1059363070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRcDJSoM26kdEZlVFekVW%2Fuploads%2F5RGUa22m3QuTyc3AFExe%2Fimage.png?alt=media&amp;token=5a7ada25-f511-4290-8795-4c3a10c62ba5" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="214.5999755859375"></th><th></th></tr></thead><tbody><tr><td><strong>Enable effect</strong></td><td>Activate a visual loading animation that appears while the page content is being loaded, enhancing user experience.</td></tr><tr><td><strong>Background color</strong></td><td>Select the main color of the effect when loading the page.</td></tr><tr><td><strong>Image</strong></td><td>Edit icon on page load.</td></tr></tbody></table>