Ever wished you could work with an AI to create, refine, and iterate your projects in real time? Canvas makes that happen.
Directly integrated into le Chat, Canvas lets you display and edit text, code, and more in a live, interactive workspace.
Prerequisites
Activating Canvas
Unlike other tools, Canvas is off by default in le Chat.
To turn it on, open the Tools menu at the bottom of the chat window (1) and check the box next to Canvas (2).
Opening the tools menu (1) and selecting Canvas (2)
📌 The Canvas tool is available alongside other tools like Code Interpreter or Web search. You can activate multiple tools at the same time.
How to open a Canvas
We designed Canvas to be easy to use and seamlessly integrated into your workflow.
Once the feature is activate, just chat with le Chat as you normally would and it will automatically open a Canvas when it's useful. Try prompts like:
“Create a presentation on the history of AI.”
“Write a Python script to analyze this dataset.”
“Design a web page for a small business.”
or even, simply “Open a new Canvas.”
📌 You can also explicitly open a Canvas by typing / in your prompt, then select Canvas from the tools dropdown.
Canvas core features
Inside a Canvas, you can take advantage of several key features:
Direct editing
Click directly into the Canvas to edit text, code or a spreadsheet, just like in a standard editor (available actions may vary by format).
🔑 Multiple Canvases can be open at once. Switch between them using the tabs at the top of the chat window.
Preview
Use the Preview “eye” button in the Canvas menu bar to toggle between the raw code/text view and a rendered view for formats like HTML & React (web pages), Mermaid (diagrams), and Marp (presentations).
Click the eye icon to toggle between the raw code/text view and the rendered view
Iteration and versioning
After le Chat generates content, you can request follow-up edits (e.g., "make this more formal" or "add a button to this component"), and it will produce new revisions quickly.
You can move between versions using the arrows in the top-left corner of the Canvas (1).
Canvas also provides a diff view that you can toggle on/off (2) to compare changes between versions.
If you want to restore the version you're viewing or revert the file to the latest version, use the buttons at the bottom of the Canvas (3).
Iterating between versions (1), toggling the diff view (2), and restoring a version or reverting to the latest version (3)
Interactive prompts
Canvas lets you interact with your content in real time using smart inline prompts.
When you select a block of text, an Ask le Chat input field appears. Enter any question or instruction, and le Chat will respond based on your selection.
Asking le Chat a question about a specific block of text
🔑 Higlighted elements (text, a spreadsheet row, etc.) are automatically included in the context of your conversation with le Chat until you deselect them.
Additionally, selecting a block of text shows predefined actions you can use to refine or analyze your content (see 🔎 Quick actions below).
Quick actions
Highlight content or click the Quick Actions button (✨ in the bottom-left of the Canvas) to access predefined actions (e.g. Translate, Optimize, Visualize).
These context-aware actions vary by format. Think of them as handy shortcuts to common tasks.
Example of quick actions for a text block
Export or Share
When you're finished, click the “share” button in the menu bar to share the whole conversation (including the Canvas).
You can also export your work, or simply copy the raw content (text, code, Markdown, etc.) to your clipboard by clicking the “copy” button.
Click the ”share” button to share your conversation, or the “copy” button to copy the raw content
Next steps
Canvas is a versatile tool, and you can use it for a wide range of tasks! Here are some ideas to get you started:
Create a presentation on a specific topic and refine it with le Chat.
Import a spreadsheet and ask le Chat to analyze the data row by row.
Write a blog post or article on a specific subject.
Polish an important email or message before sending it.
Write a Python script to analyze a dataset then visualize the results.
Test and preview a React component in real time.
Ask le Chat to debug a JavaScript function or to port it to another language.
The possibilities are endless!