Stop copy-pasting URLs between environments. One click to jump from localhost to staging to production — keeping your exact page, query params, and URL hash intact.
Web developers switch environments 50+ times a day during code review, QA, and debugging. Each switch is: select URL bar → copy → open new tab → paste → edit domain → hit enter. URL Environment Switcher turns that into one click.
Landing Page & Screenshots → · Install in 60 Seconds → · Developer Guide → · Read the build guide on DEV Community →
| Problem | Solution |
|---|---|
| Manually editing URLs between localhost/staging/prod | One click in the popup |
| Losing your place (path, query, hash) | All preserved automatically |
| Forgetting which environment you're on | Current environment highlighted in popup |
| Different projects, different URLs | Unlimited custom environments in Options |
| Setting up on every machine | chrome.storage.sync — config follows you |
- Download url-switcher-latest.zip (7.4 KB)
- Extract the ZIP wherever you keep extensions
- Go to
chrome://extensions→ toggle Developer mode (top right) → Load unpacked → select the extracted folder - Right-click the extension icon → Options → set your environment URLs
git clone https://github.com/ttcd77/url-switcher.gitThen follow steps 3-4 above, pointing "Load unpacked" at the cloned folder.
The same extension works in Firefox with zero code changes (WebExtensions API).
Download the Firefox build: url-switcher-firefox-v1.0.0.zip (6.6 KB)
- Extract the ZIP
- Go to
about:debugging#/runtime/this-firefox→ Load Temporary Add-on → selectmanifest.jsonfrom the extracted folder - Right-click the extension → Manage Extension → configure your environment URLs in the Options tab
Coming to Mozilla Add-ons (AMO) soon. Until then, temporary loading works identically.
Chrome Web Store also coming soon — one-click install without Developer Mode.
Click the extension icon on any page and the popup shows you:
- Your current URL
- Which environment you're on (highlighted)
- One-click buttons for each configured environment
Example: browsing http://localhost:3000/products/42?tab=reviews#section → click "Staging" → instantly navigates to https://staging.example.com/products/42?tab=reviews#section
| Environment | Base URL |
|---|---|
| Localhost | http://localhost:3000 |
| Staging | https://staging.example.com |
| Production | https://example.com |
Customize these in the Options page (right-click extension icon → Options, or click the gear icon in the popup). Add as many environments as you need — QA, preview, dev branches, any URL pattern.
| Manual URL editing | Bookmark folders | URL Switcher | |
|---|---|---|---|
| Switch environments | Copy-paste-edit | Find bookmark | One click |
| Preserves path & query | Manual | No | Yes |
| Shows current env | Look at URL bar | No | Yes, highlighted |
| Custom environments | Your brain | Limited | Unlimited |
| Syncs across devices | No | Yes | Yes |
| Cost | Your time | Free | Free (MIT) |
- Pure HTML + CSS + JavaScript — no React, no npm, no build step
- Manifest V3 architecture
- Permissions:
storage+tabs(minimal surface, no data collection) chrome.storage.syncfor cross-device config persistence- Under 10KB total
- Chrome Web Store listing (pending developer registration — see RQ-005)
- Keyboard shortcuts for each environment
- Multiple environment sets (switch between project configs)
- Team sharing — export/import environment configs
- Premium tier via ExtensionPay ($4.99 one-time) — unlimited envs, pattern matching, priority support
- Found a bug? Open an issue
- Have a feature idea? Comment on Issue #1 (Release Discussion)
- Want to improve it? Fork, branch, PR — small focused PRs preferred
⭐ Star this repo if it saves you time. Stars help other developers discover it through GitHub search.
- Form Handler for Google Sheets — Zero-cost contact form backend. Works with any static site. Google Apps Script, no server needed.
MIT — use it, fork it, ship it to your team. No strings attached.