Легко создавайте классные CSS-анимации с Animista

Есть множество веб-приложений CSS анимации онлайн. Но очень немногие сравнивают с уровнем детализации и простотой использования Animista,

Это бесплатное веб-приложение позволяет создавать собственные CSS-анимации одним нажатием кнопки. Вы выбираете между заранее разработанными движениями, такими как слайды, трансформации, колебания и даже анимации с тенями.

Создав анимацию, вы можете экспортировать код, как и в других генераторах CSS. За исключением того, что с этим кодом гораздо проще работать и даже поставляется со встроенным инструментом минификатора.

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)

Читайте также: 30 крутых анимаций CSS, которые вы должны увидеть

Поначалу интерфейс может показаться запутанным, но это только потому, что у вас есть много вариантов!

Вы создаете пользовательскую анимацию, выполняя три основных шага и используя интерфейс сверху вниз:

Выберите стиль движения (свинг, слайд, флип-масштаб) из кругов вверху.
Настройте его с различными типами движения под
Отредактируйте параметры анимации на плавающей панели параметров слева

Благодаря этому процессу вы можете изменить общую продолжительность анимации, стиль смягчения, задержку, почти все. И все это работает через чистый CSS3, что делает его еще более впечатляющим.

Также обратите внимание, что на самой верхней панели навигации вы даже можете выбирать различные типы стилей анимации.

По умолчанию используется «базовый», который может работать практически с чем угодно (при наведении, щелчке или немедленной анимации). Другие цели включают в себя текст страницы, фоновую анимацию и даже пользовательскую анимацию входа, чтобы отобразить скрытый элемент страницы.

Мне особенно нравится ссылка «внимание» вверху, которая имеет несколько классных эффектов дрожания и дрожания для стилей кнопок. Они отлично работают на кнопках CTA, чтобы привлечь внимание и стимулировать взаимодействие с пользователем.
Закончив настройку, просто нажмите маленький значок скобки в правом верхнем углу панели предварительного просмотра.

Это открывает новую страницу с вашим полным CSS-классом анимации вместе с ключевыми кадрами. Дополнительные функции позволяют минимизировать код и включают автоматический префикс, который поддерживает старые веб-браузеры.

Я использовал тонны пользовательских инструментов CSS-анимации, и, без сомнения, Animista – самый многофункциональный инструмент. Сначала он абсолютно бесплатный и немного сложный, но как только вы поймете интерфейс, он станет лучшим генератором, который вы сможете использовать.

Чтобы попробовать, просто посетить домашнюю страницу и нажмите «Попробуйте меня». Вы также можете поделиться своими мыслями и комплиментами с создателем веб-приложения @ ana108,

Читайте также: Как создавать анимацию и переходы с помощью Motion UI

            <script async src="https://triu.ru/wp-content/litespeed/localres/aHR0cHM6Ly9wbGF0Zm9ybS50d2l0dGVyLmNvbS93aWRnZXRzLmpz" charset="utf-8"></script>