3D Carousel-Slider Image & Video Gallery

A Lightweight Component for Vanilla JavaScript & Three.js

Product Overview

This standalone 3D image and video carousel brings immersive motion and interactivity to any website — without requiring a JavaScript framework. Built with pure JavaScript and powered by Three.js, this rotating gallery component is ideal for CMS platforms, static sites, marketing pages, and any project that needs a high-impact media showcase.

What’s Included

A flexible, embeddable component featuring:

• 3D cylindrical carousel with real 3D depth
• Native JavaScript (no React or frameworks)
• Support for images and videos
• Drag to rotate + scroll interaction
• Mobile-optimized and touch gesture support
• Drop-in usage with HTML, WordPress, or Webflow

Key Features

Mixed Media Support

Display both images and videos in the same carousel. Works with common formats like JPG, PNG, MP4, WebM.

Multiple Aspect Ratios

Easily choose the shape that fits your content:

• 1:1 — For avatars, thumbnails, grids
• 3:2 — Natural photo layout
• 16:9 — Best for widescreen video (default)
• 9:16 — For mobile-first portrait visuals
• Smart Layout Scaling

The component adjusts automatically based on your media:

• 1–5 items → compact
• 6–8 items → medium
• 9–12 items → wide
• 13+ items → panoramic
• Interactive Controls
• Scroll to spin the carousel
• Drag on desktop or swipe on mobile
• Hover interactions with depth and parallax
• Optional auto-rotate mode
• Fully Responsive Design
• Mobile-first touch controls
• Flexible container sizing
• Retina-ready rendering
• Seamless scaling on any screen size

Use Cases

• Product showcases for ecommerce
• Visual media galleries for creatives
• Hero sections for landing pages
• Embedded showreels on portfolio sites
• 3D client presentations without React

Tech Specs

• Framework: None – pure Vanilla JavaScript
• 3D Engine: Three.js (v0.178 or newer)
• Module: ES6 + IIFE version included
• Build Tool: Rollup / Vite ready
• No third-party dependencies

What You Get

• Full production-ready Vanilla JS component
• Clean modular structure (ES module + global UMD build)
• Working example files & documentation
• Configurable options: number of items, spacing, auto-rotate, media sources, aspect ratio
• MIT License — personal and commercial use

Why Developers Use It

• No framework lock-in
• Fast load times and minimal dependencies
• Ideal for WordPress, any CMS, Webflow, static sites
• Looks great out of the box
• Fully mobile and touch-gesture ready

Ready to add 3D interaction to your site without React or Vue?

This component gives you all the visual power of Three.js in a simple, embeddable package.