Skip to main content
The canvas is where all your generated designs, variants, and components appear. Here are the essential tools that help you navigate, preview, and manage your frames.

​
Pin to Context

When you pin a frame to context, you don’t need to click the frame every time before prompting. Superdesign will automatically reference the pinned design in the chat session.
Pin to context
Use this when:
  • You want to make multiple edits in a row
  • You’re refining the same layout repeatedly

​
Reload Frame

If a session has completed but the visual frame hasn’t updated yet, click Reload.
Reload frame
Use this when:
  • The canvas looks unchanged
  • The AI output is done, but the UI hasn’t refreshed
  • You want to ensure the latest modifications are applied

​
View Code (Pro)

This feature is available for Pro users.
Clicking View Code lets you see the actual code behind the selected frame.
View code
You can:
  • Inspect the structure
  • Check component composition
  • Verify naming, layout, or logic
  • Copy/paste code into your local project
Perfect for designers and engineers collaborating in real time.
Click Share to open your frame in a new browser tab. You’ll get a public sharable link that you can send to coworkers, clients, or collaborators.
Open sharable link
Useful for:
  • Design reviews
  • Quick feedback loops
  • Sharing single frames without exposing the whole project

​
Preview in Tab

Previewing a frame in a new tab opens it inside the Superdesign portal with fewer interface distractions.
Preview in tab
Use it when:
  • You want to inspect spacing and alignment clearly
  • You’re tweaking visual details
  • You need a clean view without the toolbar or chat interface
This gives you a focused, distraction-free environment for precise UI adjustments.

​
More Options Menu

Click the more options menu (⋯) to access additional frame actions.
More options menu

​
Rename Node

Use Rename to give the frame a clear, descriptive name. This helps keep your project organized—especially when working with multiple variants or complex layouts.

​
Duplicate Node

Click Duplicate Node to instantly create an exact copy of the selected frame. This is useful for:
  • Creating manual variations
  • Experimenting with different edits
  • Keeping a backup before making major changes
The duplicated frame will appear next to your original.

​
Delete Node

Click Delete Node to remove the frame from your canvas.
Deleting a node removes it permanently from the canvas. Make sure you have duplicated any versions you want to keep before deleting.