✔︎ Framer University: https://frameruni.link/yt
✔︎ Create a free Framer account: https://framer.university/free-account
In this Framer tutorial, I’m walking you through building an impressive 3D website from absolute scratch. You’ll learn how to create interactive 3D carousels, cursor-following effects, and responsive layouts – taking your Framer skills from basic to advanced. Perfect for designers ready to level up their portfolio with stunning 3D interactions.
→ Remix the tutorial project: https://framer.university/resources/animated-3d-hero-section-in-framer
00:00 – Introduction & Project Goal
00:47 – Inspiration & Starter File Overview
05:43 – Setting Hero Section to Full Viewport Height (100VH)
09:24 – Creating a Content Frame with Max Width for Structure
11:32 – Adding and Styling Hero Text Responsively
12:35 – Fixing Content Frame Height for Text Wrapping
21:29 – Building the 3D Carousel Structure
22:42 – Adding Continuous Rotation Loop Effect
35:58 – Creating the Top Navigation Structure
38:23 – Adding Menu Items with Hover States
41:08 – Creating Bottom Links Layout
47:27 – Responsive Adjustments for Tablet & Mobile
49:56 – Final Review & Conclusion
Follow me on:
X: https://twitter.com/learnframer
Instagram: https://instagram.com/framer.university
