Component instances in Figma - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a component instance in Figma?

A component instance is a copy of a main component that inherits its properties but can have some overrides like text or colors. It helps keep designs consistent and easy to update.

beginner

How do changes to the main component affect its instances?

When you update the main component, all its instances update automatically unless you have overridden specific properties in the instances.

beginner

Can you customize a component instance without affecting the main component?

Yes, you can override properties like text, colors, or visibility in an instance without changing the main component.

beginner

Why use component instances instead of duplicating frames in Figma?

Using instances keeps your design consistent and easier to update. If you duplicate frames, changes must be made manually in each copy.

intermediate

What happens if you detach an instance from its main component?

Detaching an instance breaks its link to the main component, turning it into a regular frame that no longer updates with the main component.

What is the main benefit of using component instances in Figma?

A They are completely independent copies

B They allow unlimited color changes without restrictions

C They update automatically when the main component changes

D They cannot be customized

Component instances update automatically when the main component changes, ensuring consistency.

If you override text in a component instance, what happens when the main component's text changes?

A The instance text changes to the main component's text

B The instance text stays as the override

C The instance is deleted

D The main component text is locked

Overrides in instances stay as they are, so text changes in the main component do not affect overridden text.

What does detaching an instance do?

A Links it to another main component

B Creates a new main component

C Deletes the instance

D Turns it into a regular frame with no link to the main component

Detaching breaks the link to the main component, making the instance a normal frame.

Which of these can you NOT do with a component instance?

A Add new layers inside the instance

B Change colors

C Override text

D Resize the instance

You cannot add new layers inside an instance; you can only override existing properties.

Why is it better to use instances instead of duplicating components?

A Instances automatically update with the main component

B Instances are smaller files

C Duplicated components are faster to edit

D Instances cannot be customized

Instances keep your design consistent by updating automatically when the main component changes.

Explain what a component instance is and how it helps in design consistency.

Think about copies that stay linked to the original but can look a bit different.

Describe what happens when you detach a component instance and why you might want to do it.

Consider when you want to make a unique change that should not update anymore.