In this beginner tutorial you'll learn how to make any website responsive using Framer breakpoints (...and some other techniques).
🔴 Working File: https://timgabe.com/resources/fully-r...
Timecodes
0:00 - Introduction
0:28 - Adding stacks to text and image elements
0:43 - Adding a frame for overlaying text on video
1:03 - Adjusting widths from fixed to fill for responsiveness
1:36 - Explanation of how text scales with device size
2:15 - Adjusting settings for responsive design
2:45 - Adjusting fixed widths for responsive text container
3:11 - Adjusting image container settings for responsiveness
3:52 - Clarification on wrap functionality and fixed width
4:13 - Using fixed width on items for responsive design
4:47 - Creating tablet breakpoint and adjusting settings
5:15 - Changing individual element settings within breakpoints
5:57 - Adding max-width to images and adjusting padding
6:11 - Creating phone version and adjusting settings
6:41 - Reviewing responsive design across device sizes
7:16 - Fixing positioning issue
#framer #framertutorial
➡️ QUESTION — Have a question about UI, UX or Product Design? Designing in Framer? Or Anything Else? Post in the comments section of this video—I’m happy to answer!
Watch video Framer Breakpoints in 7 Minutes (Beginner Tutorial) online without registration, duration hours minute second in high quality. This video was added by user Tim Gabe 01 January 1970, don't forget to share it with your friends and acquaintances, it has been viewed on our site 31,536 once and liked it 850 people.