---
url: "/de/bannerify/animation/animation-easing.md"
description: "Wähle Easing-Kurven, um das Timing deiner eigenen Animationen zu steuern."
---

# Das Easing der Animation festlegen

> Wähle Easing-Kurven, um das Timing deiner eigenen Animationen zu steuern.

### Video-Tutorial: Eigene Animationen zu deinen Banner-Designs in Figma hinzufügen

Dieses Video zeigt, wie du mit dem Bannerify-Plugin eigene Keyframe-Animationen zu deinen Bannern hinzufügst.
[Embedded media](https://www.youtube-nocookie.com/embed/Js4uSQ855uo)

[Video](/assets/videos/bannerify/animation/changing-easing.mp4)

Welches Easing deine Animation haben soll, legst du über eine Option im Menü **Easing** fest. Das Easing gilt automatisch für deine gesamte Zeitleiste und aktualisiert den Bereich **Live preview**, sodass du siehst, wie das gewählte Easing die Bewegung deiner Keyframe-Animation verändert.

Folgende Easing-Optionen stehen zur Auswahl:

- Ease (Standard)
- Ease out
- Ease in
- In and out
- Linear
- Gentle
- Overshoot
- Anticipate

## Einen eigenen Cubic-Bezier-Wert für das Easing festlegen {#setting-a-custom-cubic-bezier-easing-value}

### Video-Tutorial: Cubic-Bezier-Easing zu Banner-Animationen in Figma hinzufügen

Dieses Video zeigt, wie du mit dem Bannerify-Plugin eigenes Cubic-Bezier-Easing zu Banner-Animationen in Figma hinzufügst.
[Embedded media](https://www.youtube-nocookie.com/embed/uS2TRRQiYzw)

Für eine eigene Kurve ziehst du die Anfasser der Kurve im Menü **Easing** oder fügst einen gültigen CSS-cubic-bezier-Wert (zum Beispiel `cubic-bezier(0.65,0.05,0.36,1);`) in das Feld unter den Presets ein. Eine eigene Cubic-Bezier-Kurve kannst du mit einer Website wie [https://easings.co/](https://easings.co/) oder einem anderen Dienst deiner Wahl erzeugen, der dir hilft, eigene CSS-cubic-bezier-Kurven zu erstellen.
