AI in Whiteboard Mode

Generate diagrams, modify existing content, and ask questions about your whiteboard — all through natural language prompts. AI updates are merged directly into your live scene.

Opening the AI Assistant

Access the AI command panel in two ways:

Toolbar Button

Click the animated sparkle icon at the right end of the whiteboard toolbar. It has a distinctive rainbow gradient border.

⌘/Ctrl+K

Keyboard Shortcut

Press ⌘/Ctrl + K from anywhere in the editor to open the AI panel. Works in both flowchart and whiteboard modes.

Three AI Modes

The AI panel offers three modes, each shown as a tab. Select the mode that matches what you want to do, then choose a suggestion template or type a custom prompt.

Create

Generate new content

AI generates a complete whiteboard scene from a text prompt. Shapes, arrows, text, and layout are produced automatically — you refine the result afterward.

Quick-action templates

Diagrams

  • Simple flowchart
  • Decision tree
  • Architecture diagram

Wireframes

  • Login page wireframe
  • Dashboard layout
  • Mobile app screen

Mind Maps

  • Project brainstorm
  • Feature mapping
  • Concept exploration

Planning

  • Sprint board
  • Product roadmap
  • Timeline with milestones

Edit

Modify existing content

AI reads your current whiteboard scene and applies modifications based on your instruction. Changes are merged into the live canvas so you can review and refine.

Quick-action templates

Style

  • Change all rectangles to blue
  • Add labels to shapes
  • Set roughness to 0 for clean lines

Structure

  • Connect shapes with arrows
  • Reorganize into a grid layout
  • Add a new section below

Cleanup

  • Remove all arrows
  • Remove standalone text
  • Simplify by removing duplicates

Ask

Analyze content

AI answers questions about your whiteboard — describing content, listing elements, identifying gaps, and explaining the flow. No modifications are made to the scene.

Quick-action templates

Overview

  • What's on this whiteboard?
  • List all shapes and labels
  • Describe the connections

Analyze

  • Any missing pieces?
  • What flow does this show?
  • How are elements organized?

Image Attachments

Attach images to your AI prompts for visual context. This is especially useful for Create mode when you want the AI to reference an existing design.

5

Max images per prompt

5 MB

Max size per image

PNG/JPG/WebP

Supported formats

How AI Results Are Applied

1

AI generates elements

The AI returns a structured JSON response with shapes, arrows, text, and layout positions.

2

Elements merge into scene

For Create, new elements are added to the canvas. For Edit, existing elements are modified or removed. The scene updates live.

3

You refine manually

After AI applies changes, use the drawing tools to adjust positions, colors, text, and connections. Undo (⌘/Ctrl+Z) if the result isn't what you expected.

Tips for Effective Prompts

  • Be specific about layout — "Draw a flowchart with 5 steps arranged top to bottom" works better than "make a flowchart."
  • Name the elements — "Create boxes for Frontend, API Gateway, Backend, and Database" gives the AI concrete labels to use.
  • Describe connections — "Connect Frontend to API Gateway with an arrow labeled 'REST'" tells the AI exactly what to draw.
  • Use Edit for refinement — Generate first, then use Edit mode prompts like "make it cleaner" or "change colors to blue" for iterative polish.
  • Attach reference images — When you have an existing design to replicate, attach it as an image so the AI can use it as context.

Tip: AI in whiteboard mode reads your entire scene as context. The more content you already have on the canvas, the more targeted the AI's edits and suggestions will be.

OpenCharts LibraryCross-Mode Conversion