Entwickler-Tools

Cubic Bezier Generator

Erstellen Sie benutzerdefinierte CSS-Animations-Easing-Kurven mit visuellem Editor

Kurven-Editor

Animations-Vorschau

Dauers

▶

CSS

cubic-bezier(0.250, 0.100, 0.250, 1.000)

transition: all 1s cubic-bezier(0.250, 0.100, 0.250, 1.000);
/* or */
animation: yourAnimation 1s cubic-bezier(0.250, 0.100, 0.250, 1.000);

Voreinstellungen & Vergleich

Was ist Cubic Bezier Generator?

Erstellen Sie benutzerdefinierte CSS-Animations-Easing-Kurven mit visuellem Editor

Cubic Bezier Generator ist ein kostenloses Online-Tool, das direkt in Ihrem Browser funktioniert. Keine Installation oder Anmeldung erforderlich. Alle Verarbeitung erfolgt lokal auf Ihrem Gerät, sodass Ihre Daten privat und sicher bleiben.

Warum Cubic Bezier Generator verwenden?

✓100% Kostenlos - Keine versteckten Kosten oder Premium-Funktionen
✓Keine Anmeldung erforderlich - Sofort nutzbar ohne Kontoerstellung
✓Datenschutz zuerst - Alle Verarbeitung erfolgt in Ihrem Browser. Ihre Daten verlassen nie Ihr Gerät
✓Blitzschnell - Sofortige Ergebnisse ohne Server-Verzögerungen

Anleitung

Geben Sie Ihren Text im Eingabebereich oben ein oder fügen Sie ihn ein
Das Tool verarbeitet Ihre Eingabe automatisch
Kopieren Sie das Ergebnis oder laden Sie es als Datei herunter

Funktionen

✓Interaktiver Drag-and-Drop-Kurveneditor
✓Über 30 Easing-Funktions-Voreinstellungen
✓Echtzeit-Animationsvorschau
✓Mehrere Animations-Eigenschafts-Demos
✓Kurvenvergleichsmodus

Häufig gestellte Fragen

Was ist cubic-bezier?

Cubic-bezier ist eine CSS-Timing-Funktion, die definiert, wie eine Animation im Laufe der Zeit fortschreitet, unter Verwendung einer kubischen Bézier-Kurve mit zwei Kontrollpunkten.

Was bedeuten die Kontrollpunkte?

Die zwei Kontrollpunkte (P1 und P2) definieren die Form der Kurve. X-Werte müssen zwischen 0 und 1 liegen, während Y-Werte diesen Bereich für Bounce-Effekte überschreiten können.