В Интернете можно найти большое количество библиотек стилей, которые помогут вам с анимацией элементов на странице.
В этой статье нет библиотек, которые помогают с синтаксимом или технологиями анимации, а скорее библиотеки «бери и используй как есть».
Добавьте класс вашему элементу, что-нибудь вроде «animate-flip-up», скопируйте стили (и отредактируйте, если нужно), и проверьте результат.
Содержание:
- Animista
- Animate.css
- Tachyons-animate
- Infinite
- Motion UI
- Micron
- Vivify
- Hover.css
- AllAnimationCss3
- Magic Animations
- It’s Tuesday
- vhs
- ReboundGen
- CSShake
- Motion CSS
- cssanimation.io
- WickedCSS
- Woah.css
- Obnoxious
- Hexa
- Mimic.css
Animista
Выберите нужную анимацию из пресетов, если нужно сделайте настройки в редакторе, скопируйте css класс и анимацию и вставьте на вашу страницу.

Перейти на Animista.
Animate.css
Одна из самых больших библиотек css анимации от Даниэла Эдена. Классическая css анимация.

Перейти на Animate.css.
Tachyons-animate
Большая библиотека css классов, которые вы можете добавить к нужным элементам. Можно использовать отдельно, можно вместе с другими библиотеками.

Перейти на Tachyons Animate. На GitHub.
Infinite
В этой библиотеке css анимации, которые работают бесконечно.

Перейти на Infinite.
Motion UI
Библиотека Sass для создания настраиваемых переходов и анимаций.

Перейти на Motion UI.
Micron
Небольшая библиотека css анимации, контролируемая javascript.

Перейти на Micron.
Vivify
Библиотека наподобие Animate.css с похожими анимациями.

Перейти на Vivify.
Hover.css
Коллекция hover эффектов, которые можно применить к ссылкам, кнопкам, лого, SVG, картинкам и так далее. Добавьте выбранный стиль, настройте под свои нужды или просто используйте для вдохновения. CSS, Sass и LESS.
Я использую эту библиотеку стилей для добавления hover эффектов в меню.

Перейти на Hover.css.
AllAnimationCss3

Перейти на AllAnimation.
Magic Animations

Перейти на Magic Animations.
It’s Tuesday
Еще одна хорошая библиотека css анимации.

Перейти на It’s Tuesday.
vhs

Перейти на vhs.
ReboundGen

Перейти на ReboundGen.
CSShake

Перейти на CSShake.
Motion CSS

Перейти на Motion CSS.
cssanimation.io

Перейти на cssanimation.io.
WickedCSS

Перейти на Wicked CSS.
Woah.css

Перейти на Woah.css.
Obnoxious

Перейти на Obnoxious.css.
Hexa

Перейти на Hexa.
Mimic.css

Перейти на Mimic.css.
Проверить правильность кода можно здесь: https://jigsaw.w3.org/css-validator/
Надеюсь, статья была полезна. Оставляйте комментарии.