Skip to main content

Syncing with Figma

Updated this week

Connecting a Figma file to Ditto isn’t a one-time import — you can sync changes between Ditto and Figma at any time. This keeps your mockups updated with the latest copy while maintaining Ditto as your source of truth.

Below, we’ll cover how Ditto keeps your copy in sync and how to resolve conflicts when they happen.


Sync from the Figma plugin

When the Ditto Figma plugin is open in your Figma file, copy syncs automatically between Ditto and your mockups. Any changes made in either Figma or Ditto update in real time. This is the primary way to keep your text in sync, and it happens automatically in the background!

💡 Keep the Figma plugin open to sync text in real time

If the plugin is closed, reopening it will automatically trigger a sync. You can also sync changes manually by clicking the sync icon (↻) in the top right of the plugin to fetch the latest text for your mockups.

Sync edits from Figma while the plugin is closed

When you edit a Figma text layer while the Ditto plugin is closed, Ditto applies that change to your text item the next time you sync via the web app or opens the plugin. This way, your work is preserved upon the next resync.

💡 Ditto also preserves any edits made when the plugin was close to variants on variant appleid Figma frames

Minimize the Figma plugin

If you want to keep syncing text changes in the background, you can minimize the plugin when you’re not using it, so its UI doesn’t clutter your screen.


Sync from the web app

Product text in your Ditto project will be synced in real time with your mockups when the Figma plugin is open. However, design previews in Ditto may take a little longer to update.

To manually sync and load the latest copy and design previews from Figma into your Ditto web app, click the sync icon (↻) in the top right of the project page.


Resolve sync conflicts

Conflicts may occur when multiple users are editing text across Ditto and Figma simultaneously, or when multiple conflicting changes were made to linked instances when plugin was closed. When you reopen the plugin and select that text item, Ditto will flag any sync conflicts.

To resolve a text conflict:

  1. Click Review conflict

  2. Choose which version to keep

  3. Click Update with selected text value to resolve

If multiple different edits were made to linked text instances resulting in more than two conflicting values, you will get two additional methods to handle the conflict: unlink and split off.

  • Unlink will unlink the text item with the selected value from Ditto. The remaining instances will be unaffected.

  • Split off will create a brand new text item with the selected value. The remaining instances will be unaffected.

Did this answer your question?