5 min tutorial on how to design an interactive dropdown list or menu in Figma.
In this video, we will create a dropdown component from scratch using text and polygon elements. After that, we will add interactivity in Prototype mode (show how to open the dropdown list and apply the on-hover effect on individual options).
—
Twitter:
Instagram:
#dropdown #dropdownmenu #dropdownlist #uidesign #ui #userinterface #userexperience #ux #productdesign #uidesigntutorial #userinterfacedesign #designinfigma
So helpful and easy-to-do
I thought figma actually had a built in dropdown. You must create one from scratch. Figma is just a graphic design tool. Not really a UI tool.
thanks for easy video but one problem occurring that after clicking one menu option than we click other menu option but first one doesn't close
Thanks but what to do if we also want to add click state also in this ..means we keep click style different but how to add in this
Everybody knows how to do this shit. IF you want to impress me, make a stack of three of these where the dropdown menu overlays the item underneath and does not push each other down when you open it.
Thank you. God bless you
Thanks, great tutorial. I have created these on a few different pages and they work fine when each page is launched individually but when clicked from one to the other via the dropdown it seems to disable all the functions of the page its linking to. Any ideas?
Am trying to this tutorial but not it's working.
THANK YOU THANK YOU!!!!!!!!!!!!!!
I actually made ur design and now I cant select the fucking option, thanks a lot for wasting all that time
this video is amazing, thank you man
But aren't we supposed to design for it to be selected too?
omg thank you for this video. I just starting to use Figma and it's took me ages just to make a dropdown menu ;-;
subscribed
How do you make this scrollable/clickable?
Thank you for the tutorial, it was really helpful.
One smol tip: you can invert the "dropdown" icon by simply pressing "shift + v".
Anyone know why only the first hover effect works but the following do not?
Millll graciassss me salvaste tantos tutoriales largos y el tuyo en 5 minutos hizooo todoooo. AMOOOO!!!
nice one thank u
Cool and easy way for a dropdown, but I have one issue: How can I select an option, that's the whole point of a dropdown. Thanks!
Tysm!
such a nice and easy way to teach! thanks