プリセット
比較
linear
ease
custom
使い方
ベジェ曲線の2つのコントロールポイントをドラッグすると、cubic-bezier()のタイミング関数がリアルタイムで編集できます。ease-in-outなど9種類のプリセットから始めて微調整することも可能です。 プレビューでは、作成したイージングとlinear・easeを並べてアニメーションを再生でき、再生時間も変えられるため、体感の違いを確認しながら調整できます。仕上がったcubic-bezier()の値はコピーしてそのままCSSに使えます。
- ビジュアルドラッグ＆ドロップ曲線エディタ
- 9種類のイージングプリセット
- 再生時間調整付きアニメーションプレビュー
- 並列比較（linear/ease/カスタム）
こんなときに使おう
- CSSトランジションのタイミングを微調整するとき
- イージング曲線を比較したいとき
- スムーズなアニメーションをプロトタイプするとき