New
New
New
Component
Animated 3D Website Intro in Framer
This is an animated 3D website intro recreated in Framer from Joost's original work. Remix the project and explore how to create this type of smooth entrance animation in Framer without writing any code.
Created by
About the resource
To create this animated 3D website intro, I built three variants of the main component: out, in, and expanded. The layout uses a container with stacked cover components, each having default and hoverable variants. In the expanded state, I repositioned each image and applied 3D rotations to create the diagonal stacked effect.
Here’s the clever part: I switched over the variants of cover component from default to hoverable, in the expanded state. That means the hover interactions only become active when the animation reaches the expanded state
About the resource
To create this animated 3D website intro, I built three variants of the main component: out, in, and expanded. The layout uses a container with stacked cover components, each having default and hoverable variants. In the expanded state, I repositioned each image and applied 3D rotations to create the diagonal stacked effect.
Here’s the clever part: I switched over the variants of cover component from default to hoverable, in the expanded state. That means the hover interactions only become active when the animation reaches the expanded state
About the resource
To create this animated 3D website intro, I built three variants of the main component: out, in, and expanded. The layout uses a container with stacked cover components, each having default and hoverable variants. In the expanded state, I repositioned each image and applied 3D rotations to create the diagonal stacked effect.
Here’s the clever part: I switched over the variants of cover component from default to hoverable, in the expanded state. That means the hover interactions only become active when the animation reaches the expanded state
The in and expanded varaints of the 3D intro animation component.
The in and expanded varaints of the 3D intro animation component.
The in and expanded varaints of the 3D intro animation component.
