Easing-Funktionen Visualisierer

Klicken Sie auf eine Karte, um den CSS cubic-bezier()-Wert oder TypeScript-Funktionscode in die Zwischenablage zu kopieren. Hovern Sie für eine Animations-Vorschau.

easeInSine

easeOutSine

easeInOutSine

easeInQuad

easeOutQuad

easeInOutQuad

easeInCubic

easeOutCubic

easeInOutCubic

easeInQuart

easeOutQuart

easeInOutQuart

easeInQuint

easeOutQuint

easeInOutQuint

easeInExpo

easeOutExpo

easeInOutExpo

easeInCirc

easeOutCirc

easeInOutCirc

easeInBack

easeOutBack

easeInOutBack

easeInElastic

easeOutElastic

easeInOutElastic

easeInBounce

easeOutBounce

easeInOutBounce

Info & FAQ

Info: 30 Easing-Funktionen visualisieren und vergleichen — interaktive Kurven, Hover-Animation, CSS cubic-bezier() oder TypeScript-Code per Klick kopieren. Die gesamte Verarbeitung erfolgt lokal in Ihrem Browser mit nativem JavaScript — es werden keine Daten an einen Server übertragen. Funktioniert vollständig offline als PWA.

Häufige Fragen

Welche Easing-Funktionen sind enthalten?

Dieses Tool visualisiert 30 Standard-Easing-Funktionen in 10 Kategorien: Sine, Quad, Cubic, Quart, Quint, Expo, Circ, Back, Elastic und Bounce. Jede Kategorie hat drei Varianten: easeIn (langsamer Start), easeOut (langsames Ende) und easeInOut (langsamer Start und Ende).

Kann ich den CSS cubic-bezier()-Wert kopieren?

Ja. Klicken Sie auf eine Karte, um den CSS cubic-bezier()-Wert in die Zwischenablage zu kopieren. Für Elastic- und Bounce-Funktionen — die nicht als cubic-bezier darstellbar sind — wird stattdessen der TypeScript-Funktionscode kopiert.

Funktioniert dieses Tool offline?

2Kit ist eine PWA. Nach dem ersten Besuch funktioniert es vollständig offline.

Werden Daten an einen Server gesendet?

Nein. Alle Kurvenzeichnungen und Animationen laufen vollständig in Ihrem Browser mit der HTML Canvas API. Nichts wird hochgeladen oder übertragen.

Technische Umsetzung

Die gesamte Verarbeitung erfolgt ausschließlich in Ihrem Browser — es werden keine Daten an Server übertragen. Dieses Tool funktioniert als Progressive Web App (PWA) vollständig offline: Nach dem ersten Besuch werden alle Seiten und Ressourcen vom Service Worker zwischengespeichert und sind ohne Internetverbindung verfügbar. Ihre Eingabedaten verlassen Ihr Gerät nicht, sodass Sie auch sensible Inhalte wie API-Schlüssel, Passwörter, Konfigurationsdateien und vertrauliche Dokumente sicher verarbeiten können.

▸ Seitenindex

English json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Deutsch json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Español json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Français json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Indonesia json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Italiano json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

日本語 json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

한국어 json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Nederlands json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Polski json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Português json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Русский json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Türkçe json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

Tiếng Việt json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions

中文 json-formatter html-formatter css-formatter base64 url-codec password-gen hash-generator text-diff text-transform color-converter easing-functions