# Animation

Places one of 28 ready-made looping illustrations on the page.

Use it to break up a wall of text on a landing page, space home or team page with a piece of motion that does not need a designer, pick from a fixed set of business-flavoured Lottie illustrations (Brainstorming, Team Schedule, Secure Network, and so on), set how big it should be and where it should sit. It is deliberately unstyled: no frame, border, shadow, corner radius or padding, because a box drawn around a transparent illustration reads as clutter. It plays automatically when a reader views the page and pauses while anyone is editing that page, so it never animates under an author's cursor.

![A Confluence page in edit mode with an animation in a two column layout, overlaid with a note that animations are paused while editing pages, and a callout reading type slash anim and press enter.](https://help.gocapable.com/images/f5986e55-911d-4104-bf7a-b5446b8250e4.webp)

Animations play on the published page and stay paused while anybody is editing it.

---

## See it

Every example below is a real macro on this page, not a screenshot, and each one is a configuration taken from a page somebody actually built. Open this page in the editor to see how any of them is set up.

### Center: static.app.gocapable.com

### Center: static.app.gocapable.com (2)

### Center: static.app.gocapable.com (3)

---

## Settings

![The Animation macro configuration modal with a chosen illustration previewed on the left and animation, loop, height and align controls on the right.](https://help.gocapable.com/images/00c1c6ff-c2c2-44a3-ad5f-b6c4393d2103.webp)

Pick the illustration first, then set its height, whether it loops and how it aligns, watching the preview as you go.

| **Setting**         | **Values**                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | **What it changes**                                                                                                                                                                                                                    |
| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Animation           | A fixed list of 28: Assets, Boosters, Brainstorming, Business Meeting, Business Teamwork, Color Palette, Complete Checklist, Complete Tasks, Cooperation, Creating Application, Creative Solutions, Glowing Startup, Management Tools, Office Board, Password, Scheduling, Search Engine, Secure Network, Social Media Communication, Social Media Highlights, Startup Background, Task Allocation, Team Schedule, Time, UI Design, User Interface, Visual Content, Web System. | Which illustration plays. Described in the form as "Pick the animation to use".                                                                                                                                                        |
| Loop                | On / Off                                                                                                                                                                                                                                                                                                                                                                                                                                                                        | On, the animation restarts forever. Off, it plays once and stops on its last frame. Described in the form as "Whether the animation should loop".                                                                                      |
| Invert on dark mode | On / Off                                                                                                                                                                                                                                                                                                                                                                                                                                                                        | On, the illustration's colours are inverted and hue-rotated 180° when the reader is in Confluence dark mode, so light artwork stays legible on a dark page. Off keeps the original colours. Described in the form as "Adjust the anima |
| Height              | A number from 200 to 1000, stepping in 50s                                                                                                                                                                                                                                                                                                                                                                                                                                      | Sets the size of the animation. It sets both height AND width, the animation always occupies a square box of this size (capped to the column width). Values outside 200-1000 are clamped at render. Described in the form as "The hei  |
| Align               | Left, Center, Right                                                                                                                                                                                                                                                                                                                                                                                                                                                             | Where the square sits within the page column. Described in the form as "The alignment of the animation".                                                                                                                               |

---

## Related

[CardsA grid of up to six coloured cards, each with a title, description, optional image and optional](https://help.gocapable.com/macros/cards.html)

[GalleryA set of images shown either as a grid of equal-height cells or as a swipeable carousel, with t](https://help.gocapable.com/macros/gallery.html)

[Cards, images and mediaThe rest of this family.](https://help.gocapable.com/macros/cards-images-and-media.html)

---

_A landing page, not a document._