無料のアニメーションタイミングツール
プロダクト UI のための Cubic Bezier ジェネレーター
イージング曲線を視覚的に調整し、動きを即座に確認して、CSS や JavaScript 用コードをコピーできます。
曲線エディター
cubic-bezier(.25, .1, .25, 1)
視覚的なイージング編集で CSS アニメーションを滑らかに
Motion Curve Studio は、推測ではなく視覚的な調整で実用的なアニメーションタイミングを作るためのツールです。
Cubic Bezier FAQ
cubic-bezier とは何ですか？
2つの制御点でアニメーションの加速と減速を定義する CSS のタイミング関数です。
Tailwind CSS で使えますか？
はい。Tailwind 用の出力を theme の easing 設定に追加できます。
なぜ視覚エディターが必要ですか？
速度感や余韻を見ながら調整でき、より自然な動きに近づけます。