Skip to content
BlurFirst

How to Blur VS Code for the Web When Screen Sharing (vscode.dev & github.dev)

6 min read

Doing a code walkthrough in the browser editor? Here's how to hide .env files, API keys, the terminal, and private repo names in vscode.dev and github.dev before you share your screen.

To hide secrets and code in VS Code for the Web while you screen-share, use a browser blur extension like BlurFirst to blur .env values, tokens, the terminal, and the Explorer before you present. This applies to the browser-based editor — vscode.dev and github.dev — where the entire IDE runs inside a Chrome tab. The blur is painted in as real pixels, so it survives Zoom, Microsoft Teams, Google Meet, Loom, OBS, and screenshots.

Which VS Code this covers (browser only)

BlurFirst covers vscode.dev and github.dev because those run entirely inside a browser tab — the editor, the integrated terminal, and the Explorer are all web content. The VS Code desktop app is native software outside the browser, so no browser extension can blur it; to protect a desktop session, share a single window, close sensitive files, and use your OS notification controls. If you're presenting from the web editor, the gestures below apply directly.

What's risky to show in vscode.dev / github.dev

  • .env files and secrets in open editors — the moment a tab holding DATABASE_URL or STRIPE_SECRET_KEY gets focus, the value is on screen.
  • API keys and tokens in code — hard-coded credentials, bearer tokens, and connection strings in source files and example snippets.
  • The integrated terminal — command output that echoes environment variables, deploy logs, or a printed token.
  • Private repo and file names in the Explorer — the file tree and the editor tab strip name private repositories, internal modules, and client projects.
  • Source-control diffs — the Source Control view shows added and removed lines, which can surface a secret you're about to commit.
  • Search results — a project-wide search for key or token lists matching lines across every file in one panel.

How to blur VS Code for the Web

Secrets in a code editor are almost always pattern-shaped — keys, tokens, connection strings — which is exactly what automatic detection is good at. Lead with a Scan, then hide the structural panels by hand.

  1. 1

    Arrange your editor before the call

    Open the files and panels you'll show, and get the terminal and Explorer into position, so nothing new appears mid-share. Start BlurFirst with Ctrl/⌘ ⇧ Y.

  2. 2

    Scan for keys first

    Run Scan (a Pro gesture). It's strong at exactly this: it finds and blurs API-key and token patterns, emails, credit-card numbers, and SSNs locally, so a hard-coded key in an open file or a printed token in the terminal is frosted in one click. It matches patterns, not free-text, so a project name won't be caught.

  3. 3

    Box- or element-blur the Explorer

    Hide the file tree and the editor tab strip so private repo, module, and client names don't leak.

  4. 4

    Box-blur the terminal and diffs

    Drag a rectangle over the integrated terminal and over the Source Control diff. The box stays anchored as output scrolls or you page through a long diff.

  5. 5

    Keep the panic shortcut ready

    If you open a .env by reflex or a search surfaces a secret, press Ctrl/⌘ ⇧ H to blur the whole editor instantly, then reveal what's safe.

Blur the demo, still rotate the key

Blurring stops a key from being seen on the call or in a recording, but if a secret was ever committed to a repo or run in a real terminal, treat it as compromised and rotate it. The in-page blur protects your live walkthrough; it isn't a substitute for secret hygiene like environment variables, a secrets manager, and pre-commit scanning.

Frequently asked questions

Does BlurFirst work in the VS Code desktop app?

No. BlurFirst is a browser extension and only affects content inside a browser tab, so it covers vscode.dev and github.dev but not the native desktop app. A dedicated desktop tool is in development.

Can it automatically find API keys in my open files?

Yes. The Scan gesture detects API-key and token patterns, emails, credit-card numbers, and SSNs locally and blurs them in one click. It matches patterns, so a standard-format key is caught; a value that does not match a known pattern needs a manual box or element blur.

Will the blur cover the integrated terminal?

Yes. The terminal in vscode.dev is web content, so a box blur over it is painted into the page and stays anchored as output scrolls.

Is my code sent anywhere to be scanned?

No. Scan runs entirely in your browser, so nothing you blur or scan leaves the machine. A saved blur stores only a CSS selector, and the extension's only network request is a license check.

Does blurring a secret on screen make it safe?

It hides the secret from the live call and any recording, but if the secret is real and was committed or exposed, rotate it. Blur protects the presentation, not prior exposure.

Blur it before you share it.

Hide any field, region or message on a page before your next call. Nothing you blur leaves your browser.

Add to Chrome