# Animations

## Usage

### Format

Animations can be altered using arguments provided to them. These depend on the animation type.

```html
<animation key=value key="value" key>
```

### Order

All animations have an optional argument `id`, which defines the order in which this animation is executed. By default all animations run at once, but by specifying an `id`, animations will run in order.

Example:

```html
<typewriter id=2 text="Hello"> # This will run second
<typewriter id=3 text=" world!"> # This will run third
<typewriter id=1 text="- "> # This will run first
```

## Animations

#### `typewriter`

Typewriter animation, where each letter is typed out one-by-one.

```html
<typewriter
    text="Text" # Text to animate, supports functions & placeholders
    speed=3 # Typing speed, ticks per character. 0: immediate
    cursor="_" # The cursor of the typewriter
    delay=20 # Will wait this amount in ticks before starting
    sound=minecraft:block.note_block.bell # Sound for each letter appearing
    loop # If present, will make this animation loop forever
>
```

{% embed url="<https://f005.backblazeb2.com/file/septicuss/projects/tooltips/docs/catalogue.mp4>" fullWidth="false" %}