# Add animated text

> Animate text in the web editor with typewriter, scramble and other effects, scrolling text, a number counter, and looping motion.

Source: https://screenity.io/help/web-editor/add-animated-text

Text can animate when it appears, when it leaves, and while it stays on screen. It can also scroll like a ticker or count up to a number.

## Open the animation settings

1. Select the text in the preview or on the timeline.
2. Choose **Animate** above the preview, or open the **Animation** tab in the properties panel.
3. Use **In** for how the text appears, **Out** for how it leaves, and **Loop** for motion that repeats while it is visible.

The **Style** tab next to it holds the font, color and other look settings. See [Use text templates and fonts](https://screenity.io/help/web-editor/use-text-templates).

## Choose an In or Out effect

Select an effect card, or **None** to remove the effect. The settings under the cards change with the effect:

- **Duration** is from 0.05 to 2 seconds.
- **Easing** sets how the motion speeds up and slows down.
- Some effects add their own settings, such as the direction of **Slide** and **Rise**, or the amount of **Spin**.

The timing of an In or Out effect follows the overlay on the timeline, so moving or trimming the overlay also moves its animation.

### Animate by letter, word or paragraph

Text effects also have a **Unit**: **All**, **Paragraph**, **Word** or **Character**. With **Word** or **Character**, the effect plays piece by piece instead of on the whole text. **Order** then chooses **Left to right** or **Right to left**.

### Typewriter and scramble

**Typewriter** types the text out piece by piece. It has two switches:

- **Cursor** shows a blinking cursor at the end of the typed text.
- **Hold layout** keeps the full space of the text from the start, so the typed text does not shift as it grows.

**Scramble** swaps letters for random characters before they settle into the text. **Style** sets which characters it uses.

## Loop an effect

In the **Loop** tab, choose an effect to repeat while the text is visible, or **None** to remove it. Set its **Speed** and **Intensity**.

## Make text scroll

1. Select the text and open the **Style** tab.
2. Set **Mode** to **Scroll**.
3. Choose a **Direction** of **Left** or **Right**, then set **Speed** (in pixels per second) and **Gap**, the space between repeats.

## Count up to a number

1. Select the text and open the **Style** tab.
2. Set **Mode** to **Counter**.
3. Enter the **Start** number and the **End** value. The **End** field suggests a format such as $10,000.
4. Set the **Duration** of the count in seconds, and its **Easing**.

Set **Mode** back to **Normal** for regular text.

## Animate shapes and images

Shapes and images have the same **In**, **Out** and **Loop** tabs with motion effects. The typing, scramble and unit options are only for text.