Create the card and container system: Figma Design for beginners [8 of 13]
61.2K views on YouTube
In this video, we’ll use auto layout to build a responsive card element for our portfolio’s landing page. Then, we’ll revisit the elements we built in the previous lessons and apply auto layout to them to build a container system for our portfolio. Finally, we’ll wrap things up by turning all of the elements into reusable components.
Playlist of full course here → http://bit.ly/4lPoklZ
Feel free to make a copy of the Figma community file to check out the final design and additional resources: https://www.figma.com/community/file/1499455316701927850/figma-design-for-beginners-2025-course-assets
Visit https://help.figma.com/ to view a written version of this course, along with up-to-date information on specific features.
Timestamps:
00:00 Intro
00:36 What is a card element
01:38 Build the card elements
03:54 Put the card together using auto layout
06:24 Apply max width to the card
07:57 Containers and components
09:46 Add containers to existing elements
16:01 Create multiple components
17:00 Move the components to the Components page
17:36 Outro
#Figma #design #beginners #tutorial #course
____________________________________________________
Find us on ⬇️
X (formerly Twitter): https://x.com/figma
Instagram: https://www.instagram.com/figma
LinkedIn: https://www.linkedin.com/company/figma
TikTok: https://tiktok.com/@figma
Figma forum: https://forum.figma.com/