Opening the AI Chat
Click the AI tab in the left panel of the Editor. This is where you’ll spend most of your time.Basic Prompt Examples
Start simple. The AI understands natural language — you don’t need special syntax.Modes
The Modes dropdown above the chat input changes how the AI behaves. Pick the one that fits the task.| Mode | Best for |
|---|---|
| Code | Default. Writes and edits code |
| Ask | Read-only Q&A about your codebase |
| Architect | Planning big changes before implementing |
| Debug | Diagnosing errors and broken behavior |
| Designer | Visual design and styling decisions |
| Test | Writing and running tests |
| Security | Reviewing for security issues |
| Refactor | Cleaning up and restructuring existing code |
@-Mentions for Files
Prefix a filename with@ to pull it into context.
Attaching Images and Files
You can drag-and-drop or click the paperclip to attach:- Images — up to 20 at once, 20 MB each (screenshots, mockups, references)
- Videos — up to 100 MB (user flow recordings, motion references)
- Documents — PDFs, text files, JSON
Attaching a screenshot of a competitor’s site or a Figma frame is one of the fastest ways to get the AI to nail a design.
Slash Commands
Type/ in the chat to see the command menu.
| Command | What it does |
|---|---|
/clear | Start a fresh conversation |
/compact | Summarize older messages to free up context |
/help | Show the full command list |
/context | View what files the AI currently has in context |
Reasoning Effort
The Effort selector controls how much the AI thinks before responding.- Low
- Medium
- High
Quick answers, small edits, obvious bug fixes. Cheapest.
AI Credits
Each AI response uses credits based on the model, effort level, and conversation size. You can see your usage in Settings > Billing > AI Credits.- Members can ask the AI as much as their plan allows
- Budgets let admins cap spending per project or per user
- Running low? The AI warns you before you hit your cap
Tips for Good Prompts
Be specific
Make a button is vague. Add a primary CTA button labeled "Get Started" below the hero headline is actionable.Provide context
Attach a screenshot. Mention the file. Paste an error message. The more the AI knows, the better it performs.
Iterate in small steps
Instead of one giant prompt, build in layers: structure first, then styling, then polish. Easier to review and undo.
Verifying Results
After the AI makes changes:- Scan the diff it shows in the chat
- Check the live preview in the Editor
- Open the changed files in the Code Editor to review
- If something’s wrong, say so — the AI will fix it without starting over
Troubleshooting
The AI isn't responding
The AI isn't responding
Check the status bar at the bottom of the chat. If it says “thinking” for more than a minute, the model may be overloaded — try
/clear and re-send, or switch to a different model in Settings > AI Models.I ran out of credits
I ran out of credits
Top up from Settings > Billing, upgrade your plan, or bring your own API key (BYOK) for unlimited usage at your own cost. See AI Models.
The AI made changes I don't want
The AI made changes I don't want
Open Version History from the top bar and restore the previous snapshot. Every AI change creates a checkpoint, so rolling back is one click.
The AI keeps getting the same thing wrong
The AI keeps getting the same thing wrong
Try
/clear to reset context, switch to High effort, or attach a screenshot of what you want. If it’s still stuck, switch to Architect mode and ask for a plan first.The AI won't touch a specific file
The AI won't touch a specific file
Some generated files are marked read-only (like lockfiles). Ask the AI to edit the source file instead — it knows which files regenerate the one you want changed.
What’s Next?
AI Overview
How the AI assistant works
AI Modes
Deep dive on each mode
AI Models
Pick the right model