Figma Support Forum

Create 'greyed out' option to show that multiple elements have been selected

Hi everyone

Apologies in advance for not explaining this well, I’ve searched for a tutorial for this several times but can’t find the right thing - probably because I’m not using the right keywords.

I’m making a prototype for an art gallery for a course. In the set up screen, I have listed several art periods. I would like to create an animation so that for every option the user selects, the image greys out slightly (or similar) to indicate that it has been selected.

On a separate note, I have a few text entry boxes, how do I link a keyboard so users can enter text?

Can anyone rescue me from my own stupidity and help me with this?!
Thank you

To get the greyed out interaction you described, I’d highly recommend you make interactive components that switch between different states of the images based on if the user has clicked on it. Otherwise, you will have to create multiple screens in your prototype that also forces you to have a particular order in which images can be selected.

For the text entry boxes, there currently isn’t a way to have users enter text in a prototype (the team is definitely aware of this ask and is looking into it), so the best you can do is either “fake it” by adding a keyboard image into your prototype or just have the text boxes populate with pre-set text when users click on nit.