On this page

A detailed reference for bringing Figma work into Moio — covering both file import in the dashboard and copy-paste in the editor, including placement rules, limitations, and error messages.

## File import

### Supported file types

| Extension | Source |
| --- | --- |
| `.fig` | Figma |
| `.sketch` | Sketch |
| `.xd` | Adobe XD |

### How to import

1. In the dashboard, open the workspace folder you want to import into.
2. Click **Import .fig or .sketch** in the action bar.
3. Select one or more files.
4. The import modal shows per-file status until all files complete.

You can also drag and drop files directly into the file list.

If the folder is read-only, the drop area shows "Cannot import into a readonly folder" and blocks the drop.

### What imports from a .fig file

A `.fig` file is a self-contained archive that bundles your designs, components, and images. On import:

- **Images** are extracted and uploaded automatically. All image fills are preserved.
- **Components** from external Figma libraries are imported as local copies (no shared library support yet).
- **Design tokens** (Figma variables) are not preserved. Variable-bound values import using their static/resolved values, but the bindings themselves are dropped.

## Copy-paste from Figma

### How it works

1. In Figma, select and copy the layers you want (Ctrl+C / Cmd+C).
2. In the Moio editor, paste (Ctrl+V / Cmd+V).
3. Moio detects the Figma clipboard content and converts it automatically.

### Paste placement rules

Where pasted content lands depends on your current selection:

| Selection state | Paste target |
| --- | --- |
| Nothing selected | Source container when possible, otherwise the page |
| Single frame selected | Inside that frame (unless it's the copied container, then into its parent) |
| Multiple objects selected | Closest common ancestor. In flex frames, items insert to the right of the selection. |
| Replace selection | Into the selection's parent |

### Limitations

**Images don't transfer.** Figma's clipboard format doesn't include image data. Image fills are silently removed from pasted objects. To keep images, import the full `.fig` file instead.

**Design tokens aren't preserved.** Same as file import — variable bindings are dropped, static values are used.

**Components become local copies.** External library components paste as local components. After pasting, you'll need to set the [behavior](/content/docs/core-concepts-component-behaviors/index.html) and adjust variant naming to activate interactive states.

## Error messages

| Message | Cause | Fix |
| --- | --- | --- |
| "Cannot import into a readonly folder" | No edit permission in the target folder | Switch to an editable folder or ask a workspace admin for access |
| "File type not supported" | File extension isn't `.fig`, `.sketch`, or `.xd` | Export a supported file type from your design tool |
| "Could not decode Figma clipboard content" | Clipboard data couldn't be processed | Copy the layers again in Figma and paste once more |
| "Could not paste outdated clipboard data" | Clipboard uses an incompatible document schema | Recopy from the current file/version in Figma.