Your First Canvas

A complete cold-start walkthrough for each editor.

Before you start

Make sure you have:

  • Jetro installed in your editor (Install Extension)
  • A workspace folder open (any folder works)

Antigravity + Claude Code (recommended)

Our recommended setup. Claude Code picks up Jetro’s tools automatically, zero config needed.

  1. Open a workspace folder. Jetro will create a .jetro/ directory for config and cache.
  2. Sign in to Jetro. Click the Jetro icon in the activity bar (left side) to open the sidebar. Hit sign in and create your account. You need an account for the extension to work.
  3. Install Claude Code. Open the Extensions sidebar (Cmd+Shift+X), search for “Claude Code”, and install it. Sign in with your Claude Pro or Max subscription.
  4. Open your first canvas. Open the Command Palette (Cmd+Shift+P) and run “Jetro: Open Canvas”.
  5. Talk to your agent. In the Claude Code chat, try something like “Build me a dashboard that shows the top 5 trending stocks today.” The agent will use Jetro’s tools and build it right on your canvas.
MCP auto-discovery

Claude Code picks up Jetro’s tools automatically through the MCP config file in your workspace. Nothing to configure.

Antigravity without Claude Code

Antigravity ships with Claude Opus, Claude Sonnet, and Gemini built in. If you’ve got a Google AI Pro or Ultra subscription, you can use Antigravity’s agent chat directly. We recommend selecting Claude Opus or Claude Sonnet as your model.

Since Antigravity doesn’t auto-discover MCP tools, there’s an extra step to connect Jetro.

  1. Open a workspace folder. Jetro will create a .jetro/ directory for config and cache.
  2. Sign in to Jetro. Click the Jetro icon in the activity bar to open the sidebar. Hit sign in and create your account.
  3. Set up MCP discovery. You need to point Antigravity to Jetro’s config manually:
    • Open Antigravity’s agent chat
    • Select Claude Opus or Claude Sonnet as your model
    • Ask the agent: “Look for .mcp.json in the current workspace folder and apply the MCP config from there”
  4. Enable the Jetro MCP server. Click ”…” (top right of the agent chat), then MCP Server, then Manage MCP Servers. You should see Jetro listed there. If you don’t, hit Refresh. Once it shows up, make sure it’s enabled.
  5. Open your first canvas. Open the Command Palette (Cmd+Shift+P) and run “Jetro: Open Canvas”.
  6. Talk to your agent. Ask it to build something on your canvas. The agent now has access to all of Jetro’s tools.

VS Code + Claude Code

  1. Open a workspace folder. Jetro will create a .jetro/ directory for config and cache.
  2. Sign in to Jetro. Click the Jetro icon in the activity bar to open the sidebar. Hit sign in and create your account.
  3. Install Claude Code. Open the Extensions sidebar (Ctrl+Shift+X / Cmd+Shift+X), search for “Claude Code”, and install it. Sign in with your Claude Pro or Max subscription.
  4. Open your first canvas. Open the Command Palette (Ctrl+Shift+P / Cmd+Shift+P) and run “Jetro: Open Canvas”.
  5. Talk to your agent. In the Claude Code chat, ask it to build something. Jetro’s tools get picked up automatically.
MCP auto-discovery

Claude Code picks up Jetro’s tools automatically through the MCP config file in your workspace. Nothing to configure.

Cursor

Cursor ships with built-in AI agents. If you’ve got a Cursor Pro or Business subscription, you already have an agent ready to go. Cursor auto-detects the MCP config but won’t enable it by default, so there’s one extra step.

  1. Open a workspace folder. Jetro will create a .jetro/ directory for config and cache.
  2. Sign in to Jetro. Click the Jetro icon in the activity bar to open the sidebar. Hit sign in and create your account.
  3. Enable the Jetro MCP server. Click ”…” (top right of the agent chat), then Agent Settings, then Tools & MCP. You should see Jetro listed there. If it’s not enabled, turn it on.
  4. Open your first canvas. Open the Command Palette (Ctrl+Shift+P / Cmd+Shift+P) and run “Jetro: Open Canvas”.
  5. Talk to your agent. Open Cursor’s agent chat and ask it to build something on your canvas.

You can also install Claude Code inside Cursor if you prefer using Claude.

Verify everything works

Open the Command Palette and type “Jetro”. You should see a list of commands. If they show up, you’re good to go.

Try a simple prompt with your agent:

“Create a simple hello world app on my canvas.”

If a frame appears on your canvas, everything is connected and working.