Gesture Carousel is an experimental Framer component built around touchless interaction. The original idea started with eye-tracking and gaze-based effects, but the results were not reliable enough for a smooth browsing experience. That exploration evolved into a webcam-powered carousel controlled by hand gestures.
The component uses React, Framer, framer-motion, and MediaPipe Tasks Vision to detect hand landmarks in real time through the webcam. A tilt-based gesture system translates hand movement into carousel navigation, with gesture hygiene built in: transition locks, cooldowns, neutral re-arming, missing-hand tolerance, and fallback arrows for manual control.
Camera access is optional and only used for gesture detection. The experience is designed as a dark editorial carousel, combining cinematic motion, depth-stacked slides, and a simple onboarding flow that explains the ideal conditions for hand tracking.
Created entirely with Framer Agents 3.0 using Claude Opus 4.8.