CSS cubic-bezier ジェネレーター

この CSS cubic-bezier ジェネレーターは、P1 と P2 の制御点をドラッグしたり数値を直接入力したりして、transition や animation に使える timing function を即時に生成できるビジュアル曲線エディターです。よく使う easing プリセットと曲線図も備えており、素早く適用・微調整できます。

cubic-bezier editor

Drag P1 / P2 or edit the numbers directly.
1 0 0 1 P1 P2
Current value
{{ bezierValue }}

プレビュー

{{ bezierValue }}
The dot and card use the generated timing function.

Presets

Click a preset to apply it.

CSS

Copied!