Amaze Browser

A real Chromium browser inside VS Code.
Preview your site, open DevTools and test devices without leaving the editor.

Why Amaze Browser

• It's a real browser. Pages render in Chromium, not a static preview, so JavaScript, cookies and logins behave exactly as they do in Chrome.
• Nothing extra to install on Linux. The first time it runs, it downloads its own open-source Chromium. On macOS and Windows it uses the Chrome or Edge you already have.
• Made for building websites. DevTools, device emulation and auto-reload of local files all work inside the editor panel.

Features

Install

VSCodium, Cursor, Windsurf, Gitpod and other Open VSX editors: search for Amaze Browser in the Extensions view, or run:

codium --install-extension abhijeetkaze.amaze-browser

VS Code: download the .vsix from the Open VSX page, then run Extensions: Install from VSIX... from the Command Palette.

Getting started

1. Open the Command Palette (Ctrl+Shift+P, or Cmd+Shift+P on macOS).
2. Run Amaze Browser: Open... and enter a URL, for example http://localhost:3000.
3. Click the bug icon in the editor title bar to open DevTools.

To preview the HTML file you're editing, run Amaze Browser: Open Active File in Preview.

DevTools position

DevTools opens next to the page by default. On a smaller screen, click the layout button in the DevTools tab's title bar (or run Amaze Browser: Move DevTools...) and choose:

• Right: next to the page
• Bottom: below the page, so both get the full width
• Left: before the page
• Separate Window: its own VS Code window, for a second monitor

Your choice is remembered (setting amaze-browser.devToolsPosition).

Tabs and history

The toolbar has a + button for a new tab and a clock button that lists the 10 most recently visited pages across all tabs. History is kept between VS Code sessions.

Clear History and Cookies... (at the bottom of the history list, or from the Command Palette) deletes the history and every cookie, which signs you out of websites. It works whether or not a tab is open.

Use it from your own browser

Run Amaze Browser: Start HTTP Server and open http://localhost:8100 in your own browser (the notification and the status bar item open it for you). You get the same browser as in VS Code: each tab gets its own page, and reloading a tab keeps its page. New tabs, DevTools and "open in system browser" open as tabs of your browser, and page dialogs use your browser's own.

The server only listens on this machine and only accepts connections from its own page, so other websites can't control it. Change the port with amaze-browser.server.port, and stop the server with Amaze Browser: Stop HTTP Server. With VS Code Remote, the address shown is the one forwarded to your machine.

Downloads and uploads

Files you download are saved to ~/Downloads (change it with amaze-browser.downloadPath). A notification shows the progress, lets you cancel, and offers Open and Show in Folder when it's done. If a file with the same name exists, the new one is saved as name (1).ext.

When a page asks you to choose a file to upload, VS Code's file picker opens in your workspace folder. If the page only accepts certain types (for example images), the picker shows those first.

Commands

Debugging with VS Code

Add this to .vscode/launch.json to start a page and attach the debugger:

{
  "type": "amaze-browser",
  "request": "launch",
  "name": "Amaze Browser: Launch",
  "url": "http://localhost:3000"
}

Use "request": "attach" to attach to a page that's already open.

Settings

Which browser is used

Amaze Browser picks the browser in this order:

1. The executable set in amaze-browser.chromeExecutable
2. Linux only: a Chromium build that Amaze Browser downloads itself
3. A Chrome or Edge installation found on the system

Bundled Chromium (Linux)

If amaze-browser.chromeExecutable is not set, Amaze Browser downloads an open-source Chromium snapshot (~150MB) the first time it activates and shows the progress in a notification. Later activations reuse it.

It is saved in the extension's global storage folder:

~/.config/Code/User/globalStorage/abhijeetkaze.amaze-browser/chromium/chromium/linux-<build>/chrome-linux/chrome

The first part of the path depends on how you run VS Code:

Things to know:

• The build is pinned by CHROMIUM_BUILD_ID in src/ChromiumDownloader.ts. When it changes, the new build is downloaded once and older builds are deleted.
• The download is kept across extension updates and removed by VS Code when the extension is uninstalled.
• Chromium needs the usual system libraries (for example libnss3, libatk-bridge2.0-0, libgbm1). If they are missing, install them or set amaze-browser.chromeExecutable to another browser.
• If the download fails, Amaze Browser shows a warning, falls back to a system browser and tries the download again on the next launch.

Development

pnpm install
pnpm run build:dev   # build the webview and the extension

Then press F5 in VS Code to launch an Extension Development Host with Amaze Browser loaded.

The extension icon is drawn in resources/icon.svg. After editing it, export it to a 256×256 resources/icon.png.

Author

Amaze Browser is built and maintained by Abhijeet Mohanta. See my other projects and get in touch at abhijeetmohanta.in, or follow my work on GitHub.

Support

Amaze Browser is free and open source. If it saves you time, you can buy me a coffee to support its development.

Credits

Amaze Browser is a fork of Browse Lite by Anthony Fu, which was itself forked from Browser Preview by Kenneth Auchenberg. Thanks to both for the original work.

License

MIT

Copyright (c) 2019 Kenneth Auchenberg
Copyright (c) 2021 Anthony Fu
Copyright (c) 2026 Abhijeet Mohanta