How many animation snippets are available?

This page lists 177 curated examples. New community Tailwind components are added regularly.

Can I use snippets commercially?

Yes — all snippets are MIT licensed for personal and commercial projects without attribution.

Looking for Tailwind versions?

See Tailwind components tagged "animation" at /tailwind/tag/animation.

#animation — 177 Free Code Snippets — Page 3 of 20

#loader#animation

Liquid Loader animation

Add a utility to your UI with Liquid Loader animation. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.

2.5kView snippet

#buttons#animation+1

Liquid Fill Buttons animation on hover

Liquid Fill Buttons animation on hover — a free Bootstrap 5 button snippet. Copy the HTML & CSS and paste straight into your Bootstrap 5 project.

2.1kView snippet

#animation#buttons+1

Animated Like Button with Pure CSS

Animated Like Button with Pure CSS: a hand-crafted, open-source Bootstrap 5 button. HTML & CSS included, ready to copy.

2.2kView snippet

#typography#animation+2

Animated Text using gif Image with pure CSS

Add a utility to your UI with Animated Text using gif Image with pure CSS. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.

1.7kView snippet

#buttons#animation

Mega Button Animation

Mega Button Animation — a free Bootstrap 5 button snippet. Copy the HTML & CSS and paste straight into your Bootstrap 5 project.

1.4kView snippet

#typography#user-interface+2

Awesome text animation CSS

Free Bootstrap 5 utility snippet — Awesome text animation CSS. Preview, copy HTML & CSS, drop it into any Bootstrap 5 project.

1.6kView snippet

#CSS#typography+1

Pure CSS Typography animation

Add a utility to your UI with Pure CSS Typography animation. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.

1.3kView snippet

#animation#CSS

Awesome Music Case Animation with Pure CSS

Awesome Music Case Animation with Pure CSS — a free Bootstrap 5 utility snippet. Copy the HTML & CSS and paste straight into your Bootstrap 5 project.

1.4kView snippet

#hover#animation+2

3D hover plane effect with Pure CSS and JavaScript

Free Bootstrap 5 utility snippet — 3D hover plane effect with Pure CSS and JavaScript. Preview, copy HTML, CSS & JS, drop it into any Bootstrap 5 project.

2.9kView snippet