New Figma Components 101: Variants and Component Properties (Boolean, Instance Swap, and Text)

Thank you thank you thank you! you help me a lot!

Thank you!!

Ok so the 2022 update made it so that we don't have to create each version of the button - but what about when handing off to development? Is it useful to them to see all the different types laid out visually?

This was one of the best tutorials I've ever followed :) Thank you so much for making this, it's so clear and informative! I learnt a lot, now I need to make 100 examples to practice :D

Great tutorial. You forgot to add a link to that full Figma course you mentioned.

Thank you! This is very helpful. I tried learning from bit-size tutorials in Figma channel, but I get confused. You provide more information in this video I was able to recreate it :)

please increase your volume. is very difficult to lesion in normal speakers

Can you make every update tutorial please?? :)

After making the component in auto layout. the icon will not attached in button. please help the issue

Watched so many videos and nobody has explained it like you! Thank you.

Really Beautiful and straight forward video. I learned a lot. Thank you very much🙂

This helped a lot! Thank you so much

Why was his mouse BIG😰

Thank you so much this really help me understand components better looking forward to other of you videos

Amazing tutorial man!

When I try to drag the icon into de component , it does not get added as you show on the video and an alert message appears when i drag the icon: The variant is missing one or more properties, I just has just starting to learning , what am i doing wrong? please your help u.u

Great tutorial! Thank you!

The best explanation!

Yoooo
This was so easy to understand
Thank you so much!
I’m sending you a virtual hug right now 😭

Question: I’ve tried having icon variants that are 24x24px & and additional size. When trying to swap the size, the icon does not scale despite having the correct dimensions. I’m guessing when you add icons to buttons as a variant, you can’t have sub-variants in the icon at different sizes? Thanks for any help

Thank you so much for this tutorial, your explanations and examples are so clear! Really appreciate it

can you help me, When I try to replace the icon the icon's color will change to the original icon color not follow on button properties. is there any way to fix it?

Thanks for the video, it was super helpful

Wow master class so much useful . Subscribe his channel . Thank you dear

Thanks, a lot. this video helped me to learn varients very well.

It was really a great video

Awesome!!! Is there a way to connect those hover states and toggles to another button? How would you make a "cart" where you can add items and it will update in the summary?

Vraiment parfait ! Très clair. (very clear, perfect) 👏

I have a question: Why do previous colors I've set as Color Styles not transfer to new files? None of the colors I've set as Color Styles have appeared anywhere except in the file I created them. If it's a Style shouldn't it appear as one of my go-to options when designing across all of Figma???

Every time I learn something I'm like, "great... keep going", and then five minutes later I feel like I don't know anything. It's infuriating and extremely discouraging. I'm Gen Z and so I feel like I should just get this, but I feel like my grandma trying to use any sort of modern technology.

Please help explain it to me like I'm five. I would really appreciate it.

I really benefited from this tutorial. It was such a great help. Straight to the point explanation. Thank You

Thank you very much!!! I am learning Figma so that I could create a design plan for my android application. This greatly helped me understand the concepts between variants of component version 1 and 2. Now my workflow is comparably faster from what I started last week. Keep it up!!! I want to support you all the way!!!

Nicely explained. Thanks, Man.

This was really helpful👏 Very Well explained !

Amazing! You cleared up a lot for me in this video. I was just working on a component system yesterday, so this was timely. Thanks.

Thank you!!!!

Thank you! Very cool tutorial!

I love Figma, I got a well paid job thanks to figma <3

Thank you for the tutorial. When using Instance Swap Property, the replaced new icon is disorted in a way as if it tries to fill the container of the old icon. Is there a way for the replaced icon to come by maintaining its original size?

I've started using Figma a week now, and working with variants was not an easy thing for me + it didn't work form the first time. With this video I was able to achieve what I needed without much effort. Thank you.

I have the same color issue with icon, how did you solve that?

Excellent video. Highly recommend this. Better than figma official one for sure. Thank you 😊

This man save my ass

finally understand. thank you, great video

Omg,I'm finally able to understand this concept after watching tons of other videos, but  through your video I'm able to make it to an end and am so grateful for your video. Keep making such videos ..🥺😌✔

Thank you so much! This is the best explanation I've found!

This is pure gold, now I can have some peace. Thank you for sharing.