cubic-bezier.com

cubic-bezier.com是前端开发领域最经典的CSS贝塞尔曲线可视化编辑器，由Lea Verou创建，是调试和设计CSS transition-timing-function和animation-timing-function的必备工具。CSS中的缓动函数cubic-bezier()控制着动画的速度曲线，决定了过渡效果是匀速、加速、减速还是弹性回弹，但直接编写贝塞尔曲线的四个参数值几乎不可能直观地想象出实际的动画效果，而cubic-bezier.com完美地解决了这一问题。

该工具的使用方式极为直观：页面上显示一条标准的贝塞尔曲线，曲线的两个控制点可以自由拖拽，拖拽时曲线形状和下方的动画预览会实时更新，同时页面顶部同步显示对应的cubic-bezier()值，一键即可复制到剪贴板。工具还内置了常用的缓动函数预设（如ease、ease-in、ease-out、ease-in-out、linear），用户可以与当前自定义曲线进行对比。Library功能允许保存常用的自定义曲线，方便在不同项目间复用。此外，工具还支持导入导出曲线配置。对于任何需要精细调整CSS动画节奏感的前端开发者而言，cubic-bezier.com是一个虽小但不可或缺的工具，它让抽象的数学参数变成了可视化的、可感知的动画体验。