Cubic Bezier Generator
Визуальный инструмент для создания идеальных таймингов в CSS анимациях. Настраивайте кривые ускорения, сравнивайте с пресетами и копируйте код в один клик.
Что такое Cubic Bezier в CSS?
В CSS свойствах transition и animation скорость изменения состояний редко бывает линейной. Чтобы интерфейс выглядел живым и естественным, элементы должны разгоняться и тормозить плавно.
Функция cubic-bezier(x1, y1, x2, y2) определяет кривую скорости анимации, используя математику кривых Безье.
Ось X (Время)
Всегда идет от 0 до 1. Представляет собой продолжительность вашей анимации (duration).
Ось Y (Прогресс)
Обычно от 0 до 1, но может выходить за пределы (!), создавая эффекты пружины (bouncing).
Как читать график?
- 1Чем круче кривая, тем быстрее происходит изменение.
- 2Если кривая становится горизонтальной, анимация временно замирает.
- 3Если кривая уходит вниз (y < 0) или вверх (y > 1), происходит отскок назад или перелет вперед.
Следите за тем, какие свойства вы анимируете — это напрямую влияет на производительность страницы.
Стандартные значения
ease
0.25, 0.1, 0.25, 1.0
Значение по умолчанию. Анимация начинается медленно, разгоняется в середине и плавно замедляется в конце.
linear
0.0, 0.0, 1.0, 1.0
Равномерная скорость на всем протяжении. Полезна для спиннеров загрузки и изменения цвета.
ease-in-out
0.42, 0.0, 0.58, 1.0
Симметричный разгон и торможение. Выглядит наиболее естественно для движения элементов интерфейса.
Часто задаваемые вопросы
Лиана Арифметова
Миссия: Демократизировать сложные расчеты. Превратить страх перед числами в ясность и контроль. Девиз: «Любая повторяющаяся задача заслуживает своего калькулятора».
Был ли этот калькулятор полезен?
Отказ от ответственности
Только для информационных целей. Все расчёты, результаты и данные, предоставляемые данным инструментом, носят исключительно ознакомительный и справочный характер. Они не являются профессиональной консультацией — медицинской, юридической, финансовой, инженерной или иной.
Точность результатов. Калькулятор основан на общепринятых формулах и методиках, однако фактические результаты могут отличаться в зависимости от индивидуальных условий, исходных данных и применяемых стандартов. Мы не гарантируем полноту, точность или актуальность приведённых расчётов.
Медицинские, финансовые и профессиональные решения должны приниматься исключительно на основании консультации с квалифицированными специалистами — врачом, финансовым советником, инженером или другим профессионалом в соответствующей области. Не используйте результаты данного инструмента как единственное основание для принятия важных решений.
Ограничение ответственности. Авторы и разработчики сервиса не несут никакой ответственности за прямой или косвенный ущерб, возникший в результате использования данных расчётов. Пользователь принимает на себя всю ответственность за интерпретацию и применение полученных результатов.
Похожие инструменты
Калькулятор расхода материалов: краски, обоев, плитки
Строительный калькулятор расхода материалов. Расчет количества обоев, краски (литры), плитки, ламината и ковролина с учетом запаса.
Калькулятор теории кристаллического поля
Расчёт ЭСКП, расщепление d-орбиталей в октаэдрическом и тетраэдрическом полях, высокоспиновые и низкоспиновые комплексы, магнитный момент.
Калькулятор коммунальных платежей ЖКХ
Рассчитайте коммунальные платежи: вода, электричество, газ, отопление, капремонт. Тарифы ЖКХ.
Калькулятор энтальпии реакции (ΔH)
Стандартная энтальпия реакции, закон Гесса, тепловой эффект Q=nΔH, теплоёмкость. Таблица ΔHf.
Калькулятор загрузки грузовика и развесовки по осям
Рассчитайте нагрузки на оси и центр тяжести (CoG) грузовика. Визуализация расположения груза и проверка перегруза.
Калькулятор себестоимости изделия
Расчёт себестоимости: материалы, работа, накладные расходы. Наценка, маржа, рекомендуемая цена.
Калькулятор методологии исследований
Расчёт размера выборки, критерий хи-квадрат, корреляция Пирсона и мощность теста. Инструменты для научных и маркетинговых исследований.
Калькулятор степени потери слуха (PTA)
Расчёт степени тугоухости по аудиограмме. PTA, классификация ВОЗ, визуальная аудиограмма, бинауральная оценка.
Калькулятор площади участка
Расчёт площади земельного участка любой формы: прямоугольник, треугольник, трапеция, Г-образный, неправильный многоугольник. Результат в м², сотках, гектарах. Конвертер единиц площади.
Калькулятор шкафа-купе
Расчёт шкафа-купе: двери, профиль, ЛДСП, наполнение. Размеры, полки, штанги, ящики. Стоимость в рублях.
Калькулятор ИМТ
Узнайте свой Индекс массы тела (ИМТ) онлайн. Простой и точный расчет для мужчин и женщин.
Калькулятор ремонта кухни
Расчёт стоимости ремонта кухни с мебелью и техникой. По регионам России.
Калькулятор расхода обоев с учётом раппорта
Расчёт количества рулонов обоев с учётом подгонки рисунка (раппорта), смещения и отходов. Стандартные и широкие обои.
Калькулятор умных сетей (Smart Grid)
Расчёты умных электросетей: нагрузка, счётчики, распределённая генерация, потери, надёжность
Калькулятор времени 3D-печати
Оценка времени 3D-печати по объёму, высоте слоя, скорости и заполнению. Расход электроэнергии.