About this component

A lenticular card where the image flips between distinct frames as the user scrolls or tilts their device. Hover locks the animation at the midpoint, showing a blended transitional state between frames. Clicking advances to the next frame manually, making it ideal for before/after comparisons or revealing alternate content versions.

Difficulty

Expert

Style

3D Perspective

Frameworks

HTML/CSS, Tailwind, React, Vue, Angular, Svelte, LWC

Embed this component

Paste this snippet into any site — the design renders in a sandboxed iframe served from /embed/lenticular-flip-card.