Install and configure desktop-new-tab
Install and configure desktop-new-tab: Turn Chrome’s new tab into a desktop with folders, links, widgets, and local storage.
Follow the source instructions for desktop-new-tab. Read the prerequisites and configuration steps before running an example.
Two ways to run it
Chrome cannot use the Vite dev server as a New Tab page. Vite is only a live preview.
| Command | What it is for |
|---|---|
npm run dev | Preview at http://127.0.0.1:5173 while you edit. Not the real New Tab. |
npm run build | Writes a static extension into dist/. Load that folder in Chrome. No Vite process needed after this. |
Preview while developing
npm install
npm run devOpen http://127.0.0.1:5173. Hot reload works here. Your real New Tab still uses whatever you last loaded from dist/.
Load the extension locally (no Vite)
npm install
npm run buildThen in Chrome:
- Open
chrome://extensions - Turn on Developer mode
- Click Load unpacked
- Choose the
distfolder in this repo
Every new tab opens dist/index.html as a normal page so Chrome does not draw the “Customise Chrome” footer under the dock. Rebuild and click Reload on the extension card when source changes. Allow the extra permissions if Chrome asks.
The extension icon (public/icons/) is copied into dist/icons/ on build and shows on chrome://extensions.
Check the installation
After setup, continue with the first example. If a command fails, compare the runtime version, working directory, and required configuration with the original README before changing dependencies.
Source and help
The catalog identifies the license as MIT. Read the repository license before redistributing source or assets.
Source captured: 2026-10-11