logo
Resources
Table of content
Motiff AI
Interface
Layers and tools
Layer properties
Design systems
Prototypes
Dev Mode
Collaboration
Import and export
File settings
Account
File management
Team management
Sharing and permissions
Billing
Organization
Apps
Work with support
Help Center/Design systems/Components/Create instances

Create instances

Components are UI elements that you can reuse across your design:

  • A Main component defines the properties of an element.
  • Instances are copies of the main component that sync the changes of the main component.

'components.png'

Assets panel

You can find components in the Assets panel.

  1. 1.Select the Assets panel in the left sidebar or use the shortcut:
    • macOS: ⌥ Option + 2
    • Windows: Alt + 2
  2. 2.Find the component you want to use.
    • Local components: Components created within the current file.
    • Components used in this file: Components in this file applied from other component libraries.
    • Enabled component library: You can explore the needed component library in the Libraries modal. After applying, it will be shown in the Assets panel.

Tip: Components have two display views: a list view and a grid view. Use the Search feature to search for components in the enabled component library.

  1. 3.Drag the component to the canvas to create an instance of the component.

Copy or duplicate

Motiff supports the following ways of duplication to create instances:

  1. 1.

    Drag to copy: Select the component, press and hold ⌥ Option (for macOS) or Alt (for Windows) while dragging the component to create an instance.

  2. 2.

    Copy and paste: Select the component and use the shortcut keys to copy and paste it as an instance.

    • macOS: ⌘ Command + C and ⌘ Command + V
    • Windows: Ctrl + C and Ctrl + V
  3. 3.

    Duplicate: Select the component and use the shortcut keys to create an instance.

    • macOS: ⌘ Command + D
    • Windows: Ctrl + D