Yes, completely free with no signup. The generated CSS is yours to use commercially.

Can I copy the generated code?

Yes. Copy each animation's CSS with one click and paste it straight into your own HTML/CSS.

Do I need JavaScript to run these?

No. They are all pure CSS animations, so no JavaScript is required — they work with HTML and CSS alone.

Can I use them commercially?

Yes. The generated code is free to use in any personal or commercial project.

What kinds of animations are included?

Over 100 CSS animations organized by category — fades, slides, bounces, rotations, scaling, hover effects, and more.

CSS Animation Gallery — 100+ Free Copy-Paste Animations

🃏 3D flip card

Hover (or tap) the card to flip it over. The copied code is a :hover version that needs no JavaScript.

🧊 3D cube

A six-sided cube that rotates automatically. Hover to pause it. The rotation speed is linked to “Speed” in the sidebar.

🎠 3D carousel

A carousel of six panels arranged in a circle and rotating. Hover to pause it. The rotation speed is linked to “Speed” in the sidebar.

🎞️ Fade slider

A classic slideshow where multiple slides cross-fade and switch automatically at a fixed interval. The transition speed is linked to “Speed” in the sidebar. The copied code is pure CSS — no JavaScript.

🔁 Auto-scroll carousel

An infinite-loop carousel where cards scroll horizontally without interruption. Hover to pause it. The scroll speed is linked to “Speed” in the sidebar.

👆 Dot-nav carousel

Click the dots at the bottom to switch slides one by one. A pure-CSS implementation controlled by radio buttons — no JavaScript, no scroll dependency.

🏷️ Logo marquee

A ticker where logos or text flow horizontally without interruption — a staple for showing customers or partners. Hover to pause it. The flow speed is linked to “Speed” in the sidebar.

🎴 Coverflow

A 3D carousel where the center card faces forward and the side cards tilt away. Click the dots at the bottom to switch. A pure-CSS implementation controlled by radio buttons — no JavaScript, no scroll dependency.

🪄 Hover effects

CSS hover effects that apply only while the pointer is over the element. Hover an element to preview → copy the HTML+CSS. Everything uses only :hover and transition — no JavaScript.

CSS Animation Gallery