Introduction to Components


In this article:

Components are reusable elements that instantly sync across all repeated instances of that element within a Moqups project.

This makes it easy to apply consistent updates within projects, and avoid the tedium of reformatting over and over – one copy at a time.

You can turn any single object or group into a Component. After that, all copies of the component – called Instances – will automatically inherit changes made to the original.

Components are particularly useful when creating and maintaining frequently-repeated UI elements like headers, footers, logos, icons, modals, and device or platform-specific templates. That’s why components – also referred to as ‘symbols’ – have become such an essential tool for teams building design systems.

You can take advantage of components’ power, even if you’re not working within a comprehensive design system. Components can smooth and speed any type of workflow – on any kind of project.

By making it easier to tweak elements throughout a project, components encourage teams to experiment freely, iterate often, and accelerate the overall design and development process.

In the following section you’ll learn how to create components and instances; edit and add new objects to grouped components; apply overrides to instances; detach and reset instances; and locate and restore components.

You’ll find all of the Component and Instance controls in the top-toolbar – and in the Component section of the right-click Context Menu.