React Three Fiber scroll-driven 3D animation components
npm install @wsgrah/scrolly-threeReact Three Fiber scroll-driven 3D animation components.
``bash`
pnpm add @wsgrah/scrolly-three three @react-three/fiber @react-three/drei gsap @gsap/react react react-dom
`tsx
import { CinematicScroll } from '@wsgrah/scrolly-three';
export function Gallery() {
return
}
`
- CinematicScroll - rotating image carousel synced to scroll progress.
- useScrollProgress` - helper for reading scroll progress.
- Uses WebGL; ensure the component runs on the client.
- Provide your own layout styles around the canvas container.
MIT