This component turns your entire page into the face of a cube. As visitors scroll, the top and bottom edges fold away in real 3D and flatten back out at the ends of the page, a signature scroll effect that takes one layer and no setup.
Follow the setup guide below.
Copy the component and drop it on your primary breakpoint.
Wrap all the page sections inside a stack, and name it "Main"
Set the accessibility tag to main.
Drag this Main stack outside the primary breakpoint.
Click on the CubeBend (Component), and set the content filed to Main on the property control panel.
Set the Width of the component Fill
Set the Height to 100vh (Viewport)
Add a Max Width property and set a value (1200px is recommended)
Adjust the property controls as you wish.
Publish and preview it.
If you need any support, please reach out at hello@framerstacks.com
Check out more component in our main library collection.
This component turns your entire page into the face of a cube. As visitors scroll, the top and bottom edges fold away in real 3D and flatten back out at the ends of the page, a signature scroll effect that takes one layer and no setup.
Follow the setup guide below.
Copy the component and drop it on your primary breakpoint.
Wrap all the page sections inside a stack, and name it "Main"
Set the accessibility tag to main.
Drag this Main stack outside the primary breakpoint.
Click on the CubeBend (Component), and set the content filed to Main on the property control panel.
Set the Width of the component Fill
Set the Height to 100vh (Viewport)
Add a Max Width property and set a value (1200px is recommended)
Adjust the property controls as you wish.
Publish and preview it.
If you need any support, please reach out at hello@framerstacks.com
Check out more component in our main library collection.
