Hiya new to Figma. Just wondering if say I have created a component set/variants and I want to adjust lets say the width of all the components within the set is there an easy way to do it? My understanding is that all variations within the component set can’t be an instance of it. I was just going to shift click all that I wanted to change but wondering if theres an easier way.
Best answer by Michael_Persson
While it is possible to select all the variations and manually edit their width, it is better practice to follow atomic design principles and use nested components. By nesting components, you only need to edit the width of one component to update all of its instances.
Select a component set and press Enter/Return.
While it is possible to select all the variations and manually edit their width, it is better practice to follow atomic design principles and use nested components. By nesting components, you only need to edit the width of one component to update all of its instances.
Hi @Michael_Persson Thanks! That was really helpful 🙂
Im still learning the differences between components/component sets/instances. The icon with the multi diamond and the icon with one filled diamond I get confused with the difference. I thought the multi diamond icon was for variant sets but in your tutorial you have shown it used for the ‘atom’ element.
Hi Eva,
To be clear, they are both components. An atom is not a different type of component, it is just a mental model for how to think about the smallest building block in a layout. Read more here: Atomic Design | Brad Frost
As for the icons, a single diamond is just an instance of a component. A multi-diamond represents the base component, from which all instances derive their properties, and can have multiple variants.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.