Tired of awkward gaps in your pricing cards? In this quick Framer tutorial, I’ll show you how to use Boolean variables and Stacks to create "Smart Components." You'll learn how to hide list items when they aren't needed so your layouts stay clean and professional, no matter how much content you add.
Join Kittl for free: https://www.kittl.com/invite/gabeamaya
Join Framer for free: https://framer.link/creative-gabe
Join Contra for free: https://on.contra.com/jfnQfW
X: https://x.com/kreative_gabe
TikTok: https://www.tiktok.com/@sad_sombruh
IG: https://www.instagram.com/creative.gabe/
In this video, you’ll learn:
- How to create Boolean (True/False) variables in Framer.
- How to link component visibility to those variables.
- The secret to using Stacks so your cards "collapse" when items are hidden.
0:00 — Intro - B-roll
1:50 — The Problem: "Ghost" spacing in components
3:00 — Linking Visibility to the Boolean Variable
5:00 — Creating the Content & Visibility Variables
6:55 — Outro - Thank you!
#Framer #WebDesign #NoCode #FramerTutorial #UXDesign #components #WebDevelopment
