Animate your vue components on scroll.
HumbleScroll is a Vue 3 library that allows you to animate your components on scroll. All powered by the Intersection Observer and utility classes in TailwindCSS.
- Vue 3 and Nuxt 3 ready
- Customizable CSS animations
- TailwindCSS utility classes
- Intersection Observer API
- Typescript support
Bash
$For vue 3$npm install humblescroll-vue$$For Nuxt 3$npm install -D humblescroll-nuxt
Click to copy
Features
TailwindCSS
Animate your components with custom TailwindCSS utility classes.
Customizable
Customize animations, durations, easings and more. You can even add your own animations.
Vue Component
Use the HumbleScroll component to animate your Vue components on scroll.
Pure CSS animations
All animations are purely CSS. Triggered by the Intersection Observer API.
Responsive animations
Use the TailwindCSS responsive breakpoints prefixes to customize your animations for different screen sizes. Like sm:fade or lg:up.
Unlimited combinations
Combine fade, slide, skew, rotate, blur and more to create your own unique animations.