Skip to main content

Chat Context

Context helps AI understand your style, structure, and intent. The better the context, the better the generation.

What you can add as context

  • On‑canvas items: any shape already on the canvas (variants, components, inspiration screens, images)
  • Images via upload: screenshots or assets you attach in chat
  • @Codebase: files from your connected GitHub repository

Three ways to add context

1

Shift+Click (on canvas)

Hold Shift and click any shape to add/remove it from context. Selected context is highlighted.
2

Hover → Add as reference

Hover a non-active canvas item and click the floating “Add as reference” button.
3

Inline mentions with @

In the chat, type @ to open the inline menu. Start typing to search by name — the AI instantly searches through file names, frame names, variants, and references as you type.

Tips

Explore & Merge: Explore multiple variants, then add another variant as context to merge the best parts into one result.
Assemble sections: Build sections/pages separately, then multi-select them and ask AI to assemble everything into a single cohesive component or layout.
Be explicit: When adding context, state exactly what to apply and from which reference (e.g., “Typography from Button A, spacing from Card B”).