Opening an HTML file in a browser displays the page; opening it in VS Code lets you edit its source. Choose the editor as the file default if most double-clicks are for development. This does not change the default browser for web links.
Method 1: Use Finder
- In Finder, select a sample file such as index.html.
- Press Command–I, or choose File → Get Info.
- Expand Open with and choose Visual Studio Code. If it is missing, choose Other and locate the installed app.
- Click Change All and confirm the macOS prompt.
- Double-click another file of the same type to check the new default.
Method 2: Manage associations with Pahkui
Pahkui lets you browse by app or by format. When setting up an editor for several file types, you can inspect the current defaults and review pending changes in one window. Requires macOS 14 or later.
- Open Pahkui, switch to Format, and search for the extension you need from .html, .htm.
- Select Visual Studio Code. Use Choose another app if it is not listed.
- Review the pending association, click Apply changes, and confirm the new app in the macOS dialog.
The formats in this guide require Pahkui Pro, a one-time purchase for lifetime use. The manual Finder method does not require a purchase. See pricing
If the default app does not change
- To preview a page after changing the default, use Finder’s Open With menu to choose Safari or another browser for that one file.
- Check both .html and .htm if your project uses both extensions. macOS can group related extensions, so verify with representative files.
- VS Code’s HTML language features do not run a web server. Preview tools and a local development server are separate from the Finder file association.
Common questions
Will this change the browser used for links?
No. The default browser for web addresses is a different setting from the default app for local HTML files.
Do I need an extension to edit HTML?
VS Code has built-in HTML language support. You can edit HTML without installing an extra language extension.