Webflow 3D Interactive Cards with GLB and Custom Animations

Franco Beltramella

Completed work

3D Animator

Animator

Webflow Developer

Blender

three.js

Webflow

Design

From Flat to Depth – 3D .GLB Card Interaction in Webflow with Three.js

A visual experiment built with Webflow, custom code, and Three.js

What if a flat UI element wasn’t really flat?

This project started as a small interaction idea: three simple cards that look static until you click them.

Once clicked, they transform. Into 3D objects. Into interactive, draggable experiences. All built inside Webflow, enhanced with Three.js and .glb models.

Before and after interaction

The cards appear static on load. But once the user interacts, each card reveals its own 3D world challenging how we usually expect UI to behave.

What this shows?

Creative development is about bending tools to your vision. Webflow and Three.js are not supposed to work together by default but when you bridge them with intent, powerful things happen.

Sometimes, the most surprising results come from a single line of custom code.

Want your website to look and feel like this? Let’s build an interactive experience that gets remembered. Franco Beltramella – Creative Webflow Developer 📬 DM me or connect via LinkedIn | Twitter Portfolio https://franco-portfolio-site.webflow.io/