Canvas for Code

Updated November 2, 2026 — Le Chat Is Now Vibe. As of May 28, 2026, Le Chat is now Vibe (still at chat.mistral.ai): a single agent for work and code, with your conversations, settings, and subscriptions carried over. The legacy Le Chat experience remains accessible in Chat mode; in Work mode, agents are now skills (invoked with @), memories are the knowledge base, and deep search is the Deep Research skill. Plans are now called Mistral Free, Pro, Team, and Enterprise. This lesson now uses the name Vibe; some menus described here may have changed names or locations.

A Development Environment in Vibe

Canvas isn’t just for writing sentences. It includes a code mode that turns Vibe into a lightweight development environment: you write, edit, debug, and run code without leaving the interface. It isn’t a replacement for your IDE, and that isn’t the goal. Its place lies elsewhere: rapid prototyping, fixing an isolated bug, learning to program, and building small utility scripts that don’t justify opening a full project.

To open Canvas in code mode, just state your intent in the prompt: “Open Canvas and write a Python script to analyze a CSV file,” “Create a React component in Canvas,” “Code a JavaScript function that sorts an array of objects by date.” The language is detected automatically, and the corresponding syntax highlighting applies.

Language coverage is broad. Python dominates scripting, data analysis, and automation use cases; JavaScript and TypeScript cover web development and Node.js; HTML and CSS handle interfaces and layouts; SQL handles database queries; Bash handles system scripts and automation. Go, Rust, Java, C++, PHP, and Ruby are also supported, among many others.

Writing Code

Describe the desired output in natural language, with the same level of detail as if you were writing a ticket for a colleague: “Write a Python script that connects to a REST API, retrieves data in JSON format, filters results by date, and exports everything to CSV. Add error handling and explanatory comments.” Explicitly mentioning error handling and comments changes the generated code significantly; without it, you’ll get a happy path with no safety net.

From there, everything happens through selection. Highlight the portion to tweak and request the specific modification: add timeout handling to an HTTP request, refactor a function to make it more readable, replace a for loop with a list comprehension, add logging to a section. The rest of the file remains untouched, which saves you from the classic full regeneration trap where one fix introduces three new bugs.

The same mechanism scales up an existing script: request unit tests for a function, a command-line interface for your script, or the pagination needed to handle large data volumes.

Debugging and Optimizing

For a bug, paste the buggy code into Canvas and describe the observed behavior rather than the fix you imagine: “This Python script raises an IndexError at line 42 when the list is empty. Fix the bug and add a preliminary check.” Vibe explains the cause in the conversation panel and applies the fix in the document—read the explanation, it’s often worth more than the patch, especially if the error is design-related.

For a performance issue, select the function in question and state the constraint: “This function takes too long with large data volumes. Optimize it while keeping the same interface.” Specifying that the interface must not change is essential; otherwise, the optimization will force you to modify all callers. Proposals range from a more efficient algorithm to caching or parallel processing, applied directly in Canvas.

Running Code Without Leaving the Interface

Vibe includes an integrated Python and JavaScript interpreter: code executes and results display in the interface. This covers quick script testing, calculation verification, function behavior validation, and data visualization as charts. The gap between “this code looks correct” and “this code produces the right result” closes in a second, which remains the strongest argument for code mode.

Exporting from Canvas

A copy button retrieves the entire code snippet to paste into your usual IDE, VS Code, PyCharm, or IntelliJ. For longer scripts, direct file download saves you from indentation surprises, with the appropriate name and extension.

When Canvas serves as a prototyping workshop before integration into an existing project, the recommended workflow is:

1. Prototype the function or module in Canvas
2. Test it with the integrated interpreter
3. Ask the AI to add imports and documentation
4. Export to your project

Four Requests That Show What’s Possible

Daily automation is the most profitable ground: “Write a Python script that renames all PDF files in a folder by adding today’s date to the start of the name.” A few minutes for a script you’ll reuse dozens of times.

Data analysis follows closely: “Create a Python script with pandas that loads an Excel file, calculates the mean and median by category, and generates a bar chart.” The interpreter displays the chart, you validate immediately. On the server side, the API prototype fits in one sentence: “Write a minimal API server with FastAPI that exposes a POST endpoint to receive JSON data and store it in a list.” And for a fully standalone utility: “Create an HTML page with a VAT calculation form that works entirely client-side in JavaScript.”

Key Takeaways

• Canvas code mode offers a lightweight development environment integrated into Vibe
• Syntax highlighting and code execution are available for common languages
• Use targeted selection to modify or debug specific portions of code
• Canvas is ideal for rapid prototyping, debugging, and learning
• Export your prototypes to your IDE once validated in Canvas