Skip to main content
Wonder runs as a desktop app on macOS and Windows, and in a browser at app.wonder.so. Both open the same account, workspaces and files. The desktop app adds everything that works with your code on your computer: chats with Claude Code or Codex, your repositories and your running app. Before you start · Web and desktop · Free plan

​
Choose the desktop app or a browser

On a phone, you can sign up, sign in and finish onboarding. Everything else asks you to open Wonder on your computer.

​
Install the desktop app

Download Wonder from wonder.design/downloads. It runs on:
  • macOS on Apple Silicon or Intel
  • Windows x64
On a Mac, move Wonder to your Applications folder. Wonder can only update itself from there. The desktop app brings its own tools, so you don’t need to install them first:
  • Git and the GitHub CLI. Wonder uses its own copies.
  • Claude Code and Codex. Wonder installs them itself. You sign in with your own Claude or ChatGPT account.
You do need Node.js on your computer to run a Node app in the Preview: version 20.19 or later, or 22.12 or later on version 22. The demo app in onboarding is the one exception: it brings its own. To sign in, the desktop app opens your browser. See Sign in to the desktop app.

​
Update the desktop app

Wonder downloads updates in the background. When one is ready, an Update button appears at the top right of the window. Its tooltip says Restart to update, or Reload to update when Wonder only needs to reload.
  1. Click Update. Wonder restarts, or reloads, on the new version.
  2. If a chat is still working, Wonder asks first, for example 1 chat is still working. Choose:
    • Restart when it finishes: Wonder restarts as soon as every chat is done. Until then, a notice says Restarting when your chat finishes, with Restart now.
    • Restart now: stops the chat mid-reply and restarts.
    • Cancel: keeps working on this version.
To look for an update yourself, open the app menu and choose Check for updates. On a Mac it’s the Wonder menu in the menu bar; on Windows, click Menu at the top right of the window.

​
Find your way around the desktop app

  • Repositories: the sidebar on the left lists your repositories and their worktrees. Each chat runs in its own worktree, a separate copy of the repository on its own branch. Press ⌘ B to show or hide it.
  • The chat: chat with Claude Code or Codex beside the canvas. Press ⌘ ⇧ B to show or hide it.
  • The canvas: your designs, and your running app in a Preview next to them.
  • Tabs: your files and Previews open as tabs at the top of the window. The first tab, Files, lists your files.

​
Switch between the canvas and Dev view

Dev view gives your chat more room, with your worktree’s local files, code changes and terminals beside it. It’s the same worktree, agent and conversation you had on the canvas. Use the switch at the top right of the window: the palette for Design, {} for Code. Or press ⌘ ⇧ .. Press ⌘ J to show or hide the changes and terminal panel. When you first open the desktop app, Wonder asks What best describes you? Designer starts you on the canvas and Developer in Dev view. You can switch any time. On Windows, use Ctrl for ⌘ and Alt for ⌥. When the desktop app is installed, links to a design open in it instead of your browser. The browser tab says Opened in the desktop app. Click Stay in the browser to keep working there. To change this, open Settings > Preferences and, under Advanced, turn Open Wonder links in the desktop app on or off. Wonder turns it on the first time you sign in to the desktop app. To open a file from the browser yourself, open the Wonder menu in the file and choose Open in desktop app. It’s there while Open Wonder links in the desktop app is on.

​
Use Wonder in a browser

The canvas runs in Google Chrome, the browser Wonder recommends, and in other Chromium browsers such as Microsoft Edge, Opera and Brave. In Safari or Firefox, you can sign in and manage your account, workspaces and settings, but opening a file shows This browser isn’t supported. Download the desktop app, or click Get Google Chrome. Wonder draws the canvas with your graphics card. If your browser can’t use it, Wonder shows Enable hardware acceleration with the steps for your browser. In Chrome:
  1. Paste chrome://settings/system in the address bar.
  2. Turn on Use graphics acceleration when available.
  3. Click Relaunch.

​
If something goes wrong

  • The Update button doesn’t restart Wonder. If a chat is still working, Wonder waits for it. Choose Restart now to restart anyway.
  • Wonder couldn’t install the update. On a Mac, Wonder isn’t in your Applications folder. Click Move Wonder, and Wonder restarts from there.
  • Node.js isn’t installed in the Preview. Click Download Node.js, install it, and start the Preview again. See Fix Preview problems.
  • Wonder for desktop did not open. The desktop app isn’t installed on this computer. Click Download.
  • Chats, repositories or the Preview are missing. They’re only in the desktop app. A file shared from another organization also opens without them.