How to Copy Wireframes from Headspin and Paste Them into Breakdance.

Copying wireframes from Headspin into Breakdance is really easy. All of our wireframes come with a copy button; when clicked, it copies the wireframe’s code.

Then, open the Breakdance editor and paste the code anywhere using the keyboard shortcut CTRL + V or CMD + V (on Mac). You can also use the right mouse click to select “Paste.”

Common Issues:

Sometimes, when you open the Breakdance editor and try to paste a wireframe right away, nothing happens. This issue occurs because Breakdance needs time to initialize. Please wait approximately 3-4 seconds for the builder to fully load, then try pasting again.

If the wireframes don’t look as expected in the preview, here are the possible reasons:

• The Copilot plugin is not active.
• Copilot variables have not been generated.
• Copilot colors have not been generated.

Solution:

1. Install and activate the Copilot plugin. The first thing you should do is open its Dashboard and hit “SAVE” so that the variables can be generated.
2. In the Copilot header, click on “Sync”.
3. Open a new tab and navigate to the Breakdance builder editor. Go to “Global Settings” > “Colors” and add a random color to the Palette. Leave this tab open and return to the tab with the Headspin dashboard.
4. In the “Sync” section, click on “Run sync” – now, colors from Copilot will be created in the Breakdance Palette.
5. Remove the random color you had created.

Global settings you should configure in Breakdance:

• Primary and secondary buttons
• Form fields styling
• Global font weights (for headings and body text)
• Container section vertical spacing