Layout & Design

5 Powerful Design Features You Didn't Know Existed in Framer

Justin

2:22

27K views

Jan 8, 2025

About this lesson

We're walking you through 5 must-know design features in Framer that can level up your workflow. Ready to discover some hidden gems? Let’s dive in!

🌞 Start for free: https://framer.link/yt

📚 Learn more at: https://framer.link/yt-academy

💎 Join the Community: https://framer.link/yt-community

🎉 Follow on X: https://framer.link/yt-x

MB01WCFM5JEQDX0

0:00[Music]0:00hey Justin from framer here and today 0:02I'm showing you five killer design 0:04features in framer you might have missed 0:07let's 0:08go first up image filters simple 0:11powerful and yes we've got them select 0:14an image head to the Styles property hit 0:16the plus sign and hover over filters 0:19pick one and voila you get an instant 0:22slider to tweak the effect blur sepia 0:26saturate you name it these filters are 0:28non-destructive and perfect for dialing 0:30in your Vibe without wrecking your image 0:34next blending modes want eye-catching 0:36visuals that stand out these are your 0:39best friend grab a frame go to 0:41properties style blending and explore 0:45options like multiply overlay and Screen 0:48each mode tweaks how your frame 0:50interacts with the layers beneath it 0:52endless creative combos all 0:55non-destructive number three masks super 0:58simple crazy effect effective select a 1:01layer hit mask under Styles and boom 1:04you've got an alpha mask rotate resize 1:07or add stops to customize it you can 1:09even use images or custom svgs as masks 1:12for mindblowing effects stack masks 1:15blend them and go wild number four open 1:19type where typography gets serious 1:22select your text find open type under 1:25properties and discover features like 1:26ligatures stylistic sets and tabular 1:29numbers 1:30preview and toggle features to unlock 1:32your font's full 1:34potential finally fit text oversiz 1:38typography perfectly responsive create a 1:41frame set width to fill and switch font 1:43size to fit adjust your screen size and 1:46watch your text Flex flawlessly across 1:49devices zero hassle Maximum Impact and a 1:53quick honorable mention variable fonts 1:56adjust weight and width right in 1:58properties for custom type photography 2:00that's as dynamic as your design and 2:03that's it 5 and a half hidden gems in 2:06framer to supercharge your design game 2:09let us know your favorite in the 2:10comments below to learn more framer head 2:13over to framer dcom Academy and check 2:15out our other courses and videos and 2:17I'll see you in the next one

TeachesTypography

Also coversFrames Hover & Press Responsive Design Stacks Variables

Watch on YouTube ↗

‹ Using the Insert Panel in Framer (Fundamentals Lesson 13)

Adding Images, Videos, and Text in Framer (Fundamentals Lesson 12) ›

More in this topic