(
Loading visualLoading visualLoading visualLoading visualLoading visualLoading visualLoading visualLoading visualLoading visual
)
loading.

Unlock Unlimited Access

Sign in for free to copy all GSAP components, remix full templates, and save your favorites.

Draggable Sticker

A tactile WebGL interaction that lifts digital decals into physical space. Hovering or dragging organically peels corners from the surface, bending the mesh with real-time curvature physics, specular sheen highlights, and soft cast shadows that adjust dynamically to pointer angle and distance.

Draggable Sticker

A tactile WebGL interaction that lifts digital decals into physical space. Hovering or dragging organically peels corners from the surface, bending the mesh with real-time curvature physics, specular sheen highlights, and soft cast shadows that adjust dynamically to pointer angle and distance.

CategoryImage
TagWebGL, 3D, Draggable, Sticker, Shader, Interactive
Guide: How to UseView Guide

API References

PropTypeDefault
imageImage URL displayed on the physical sticker textureCloudinary URL
tiltInteractive 3D tilt responsiveness relative to pointer drag momentum0.1
elevationPeel-lift curvature height when pulling sticker edges0.2
lightingToggles specular lighting and metallic sheen reflectionstrue
lightingStrengthIntensity factor for specular reflection highlights (0.0 – 1.0)0.5
lightingColorHex color of the specular reflection highlight#ffffff
sheenModeSurface reflection mode ('sheen' or 'holo')'sheen'
width / heightPhysical dimensions of the sticker200 / 200

Related components