Figma tip: Make design system components more searchable
Pro tip: Add keywords to your design system component description to make them easily searchable.
Searchability in design systems is key. Designers may spend hours building and maintaining design system components, only for them not to be used due to a lack of poor documentation, poor searchability, and discoverability.
This simple but powerful tip, shared by Yamilah Atallah, will improve how you document, search and find design system components in Figma.
How to use it
Add a “keyword” section in your Figma component’s description with search keywords. You can access a component's description by clicking on the configuration icon right next to the component name on the Design panel.
Next time a designer in your team searches for a component, any of the keywords used in the description will bring up the respective component. This removes the need to remember exact component names, which is a common struggle in moderately big design systems and component libraries.
💡 Why this is useful: A form field, for example, is a fairly standard design system component. However, different naming conventions in different systems might mean that the component is called Text, Form, Field or Input. By adding those search terms inside the component description, a designer is easily able to find the form field regardless of the naming structure you follow.
What to use it for
This tip can be useful for all your design system components, especially the ones that your team members struggle to quickly find. Start by adding it to your most commonly used components, and gradually update your design system documentation by including search keywords for all of your components.
Example keyword pairings
Modal, dialog, alert
Button, action, link
Form, field, input, text
Accordion, collapse, expand
Header, menu, navigation
What about icons
Searching for icons can often be even more frustrating, as naming standards are even looser. Adding search keywords to your icons will make searching for them and using them all that much simpler.
