Генератор CSS cubic-bezier — бесплатно онлайн
Хочется, чтобы анимация ощущалась как надо — не слишком быстро, не слишком резко. Но подбирать числа cubic-bezier на глаз — мучение. Мы добавили бесплатный инструмент, в котором кривую можно просто нарисовать — CSS Cubic-Bezier Generator — прямо в браузере.
Что он делает
Вы получаете интерактивную кривую Безье с двумя маркерами-точками. Перетаскивайте их, и плавность меняется в реальном времени — так вы задаёте, как именно анимация разгоняется и замедляется. Когда кривая выглядит как надо, берёте готовое значение CSS.
Ничего не покидает ваше устройство
Всё работает прямо в браузере. Ничего не загружается и не сохраняется на сервере. Просто открываете страницу и двигаете кривую.
Как пользоваться
- Откройте CSS Cubic-Bezier Generator.
- Перетаскивайте два маркера, пока кривая не станет такой, как нужно.
- Скопируйте значение cubic-bezier и вставьте его в свой CSS.
Это бесплатно и без ограничений. Другие небольшие инструменты есть на странице приложений.