How to use variants and component boolean property in Figma | Component boolean property

With components now having properties such as boolean, text and instance swap. Here is how to use a boolean property in your component.

[kingsleydennis]

I’m glad you later showed the new updates. Now I know the difference. 🔥

[kashcash]

Thanks a lot this was the best explanation of component, variant, and property so far

[captaincoreylewis]

This was an EXCELLENT tutorial, thank you John!!! I've been very intimidated by using the boolean options and your tutorial taught me everything I needed to know and then some, like the "Select All Matches" icon that always popped up randomly! I had no idea what that did either and wondered why it was there and now I use it ALL the time!!! Keep up the amazing work and helpful tutorials! 🔥

[doyelganguly]

Thanks a lot John! You explained the booleans property very clearly..it helps me a lot! 💓

[_Andy_A]

Great video, really clear and easy to follow, thank you!

[Jennie-otmz]

Thank you so much John! Really helped me a lot!

[precious.xoxo__]

You just made a big fan! Thanks a bunch

[Mikinosekai]

Thank you! I was struggling with this.

[marie]

Thank you! This is well explained, exactly the answer I needed.

[alwayjohnrallos]

ughh, found what I'm looking for... thank youu

[StellaRigby]

YESSS JUST WHAT I NEED!! Man, you're a

[OMalllysongz]

Good tutorial, I do not understand why Figma added the boolean option, we could do the same with a Variant and an property "icon visabilty" with a value "On, Off". It would do the same thing...

[ljhkfii]

Hey John, thanks a lot for this tutorial. I had one question though. When I click the purple bounding frame that contains the component and variants I am unable to see the chips that show the names of the 2 variants. Instead it shown a drop down and that contains the variants. When I try renaming this, I am unable to get the ON/OFF toggle on the instance. Is this something that has changed after a recent update.
Thank you in advance!

[GGeeaazzyy_broo]

Hi, very awesome and excellent effort. I am trying to design a form after watching your a lot of tutorials please guide me I want to display input field when I click on radio button otherwise field is hide can you guide me please to complete this task?

[souleater]

This is great but to make it work as designed I had to add auto layout to the whole component, not just the text.

[abdulrahmaniliyas]

To be honest, it was not helpful. how come the button with icon had a variate with a property light n home. you skipped fundamental details. how do you expect me to learn.