Animate.css 是一套現成的 CSS 動畫函式庫，可以直接透過 class 套用淡入、彈跳、滑入等動畫效果。
安裝
當時可以透過 npm 安裝：
npm install animate.css --save
並在專案中引入：
import 'animate.css';
如果只是一般 HTML 頁面，也可以直接使用 CDN：
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css"
/>
使用方式
v3 版本只要加入 animated 與想使用的動畫名稱即可：
<div class="animated fadeIn">
Hello Animate.css
</div>
例如常見的動畫：
<div class="animated bounce">Bounce</div>
<div class="animated fadeIn">Fade In</div>
<div class="animated slideInUp">Slide In Up</div>
動畫名稱可以直接到 Animate.css 官方網站查看效果後選擇。
2026 年後記
Animate.css 後來升級到 v4，class 名稱加入了 animate__ 前綴，例如：
<div class="animate__animated animate__fadeIn">
Hello Animate.css
</div>
因此如果看到舊文章使用 animated fadeIn，通常是 Animate.css v3 時期的寫法。
現在 Animate.css 仍可使用；是否採用套件、其他動畫工具，或自行撰寫 @keyframes，可以依專案需求決定。