About this Component
Create a cinematic 3D scroll experience using a rotating image cylinder.
This component maps your images onto a 3D cylinder and animates it based on scroll. As users move through the page, the camera shifts position while the cylinder rotates, creating a rich sense of depth and motion.
Text content fades in and out in sync with each section, making it perfect for storytelling layouts.
It also includes animated orbit lines that react to motion, adding an extra layer of visual detail.
Everything is fully responsive and adapts smoothly across desktop and mobile.
No complex setup.
Just drop it inside a scroll section and it works.
Perfect For:
Landing page hero sectionsScroll-based storytellingPortfolio presentationsAgency websitesProduct showcasesEditorial experiences
Key Features:
Fully responsive across all screen sizesScroll-driven 3D cylinder animationCinematic camera movementText transitions synced with scrollCustom slide content (image + title + description)Flexible text positioning (top, center, corners)Adjustable cylinder size and camera distanceAnimated orbit lines with motion-based opacitySmooth performance using WebGL (OGL)Scroll indicator with customizable label
How to Use:
Add your slides (image + text)Place the component inside a scroll sectionAdjust radius, height, and camera settingsCustomize text styles and layout
Important Note
For best results, use high-quality images with similar aspect ratios to maintain a smooth cylinder texture.
Questions? Reach out at hasanwali6890@gmail.com
Refund Policy
All sales are final upon purchase as this is a non-tangible digital product. A refund is offered only if the component suffers a critical technical failure that prevents its core function and cannot be resolved within a reasonable timeframe. Refunds are not issued for buyer's remorse, aesthetic preference, or modifications made after purchase. Report confirmed technical failures with evidence within 14 days of purchase.
Hasan Wali
