キュービックベジェジェネレーター
2 つのハンドルをドラッグして CSS のイージングカーブを作成できます。linear のタイミングと動きを比べ、トランジションや Tailwind 用の cubic-bezier() をコピーしましょう。
カーブエディター
どちらかのハンドルをドラッグします。破線は linear のタイミングです。
動きのプレビュー
作成したカーブ
リニア
再生時間の 10 分の 1 ごとの位置
transition: transform 1000ms ease; /* or */ animation-timing-function: ease;
すべての処理はブラウザー内で完結します。
関連ツール
形式の参考資料
ツールページの更新日：