Part of 100+ video lessons
Short, step-by-step lessons you can rewatch anytime.
Hands-on project
Follow along in the host project and build as you learn.
Certificate path
Counts toward your Framer Fundamentals certificate.
Clip and visible
Clip crops content to the frame. Visible lets it spill out while the frame still controls the layout.
Clip versus hidden
They look the same, but hidden breaks sticky positioning while clip keeps it working.
Button
Scroll and per-axis control
Use scroll to make overflowing content scrollable, and set overflow X and Y separately.
PICK THE RIGHT OVERFLOW
Ryan resizes an image inside a stack and switches between each overflow type to show what changes.
Select the parent frame
Overflow is set on the frame that holds the content, under Styles in the properties panel.
Choose a type
Clip, visible, hidden or scroll, depending on how the content should behave.
Set an axis if needed
Add overflow X or Y from the Styles panel to scroll in one direction only.
05:14
Know all four overflow types
Explain what clip, visible, hidden and scroll do to content that doesn't fit.
05:14
Keep sticky positioning working
Understand why hidden breaks sticky elements and when to use clip instead.
Build scrollable containers
Use scroll overflow to create horizontal image rows and other scroll areas.
Layout in Framer
Framer's layout system works like auto layout in Figma or Flexbox in Webflow. Learn how stacks and grids bring alignment and order to your elements.
Scale Tool in Framer
There are two ways to scale elements in Framer, and they behave differently. One applies a visual scale, the other changes the real sizes.
CURRICULUM
WHAT YOU'LL LEARN IN THIS COURSE
In the Ultimate Framer Masterclass, you’ll master Framer from the ground up. Follow real projects, get expert feedback, and finally design and ship the way you’ve always wanted to.
FUNDAMENTALS
Build a row of images that is wider than its frame. Try each overflow type, then set it to scroll horizontally only.
Learn the basics
PUBLISH CHECKLIST
Is the page responsive?
Do I use a container?
Using text & color styles?
Used components for reusable elements
Updated SEO
Published my site
TRY IT OUT
Cesar Rodrigues
Founder, Craate Creative
CERTIFICATION
BECOME A CERTIFIED FRAMER MASTER
Earn 3 official certifications that show you don’t just know Framer, but you can
design, build, and execute real pixel-perfect sites.
Rated excellent by 900+ students
4.8
Lifetime access
14-day money-back guarantee
Stream anywhere
