An interactive 3D drink can component built for Framer using WebGL2, no dependencies. Wrap your artwork around a photoreal brushed-metal can, add procedural condensation, and let visitors spin the can with drag controls. All controls are editable in the Framer properties panel, and the component pauses off-screen, adapts resolution, and falls back gracefully without WebGL.
What's inside
- Framer component using WebGL2, no libraries or external dependencies
- Label wrap modes: Crop, Full Art, Stretch fit
- Auto rotation detection and auto-sizing for any artwork ratio
- Controls for label height, lift, spin, zoom, lens depth and camera tilt
- Metal presets: silver, steel, gold with matte, satin or gloss ink
- Procedural dew drops with controls for amount, density, size and end-cap dew
- Adjustable pull tab open angle and soft floor shadow with float fade
- Lighting presets: Soft Studio, Spotlight, Golden Hour, Neon Night, plus custom neon glow, light power and reflection strength
- Interaction options: drag to spin with glide and inertia, drag tilt, hover tilt, optional snap back, click to flip or pop, idle spin, gentle bob
- Four entrance animations: Drop, Orbit, Rise, Full Turn
- Performance features: transparent background, fully responsive, respects reduced-motion, pauses off-screen, adaptive resolution
- Zero setup, drop on the canvas and publish
