How to open CSS files in VS Code by default on Mac

Method 1: Use Finder

1. In Finder, select a sample file such as styles.css.
2. Press Command–I, or choose File → Get Info.
3. Expand Open with and choose Visual Studio Code. If it is missing, choose Other and locate the installed app.
4. Click Change All and confirm the macOS prompt.
5. 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.

1. Open Pahkui, switch to Format, and search for the extension you need from .css.
2. Select Visual Studio Code. Use Choose another app if it is not listed.
3. 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

• If VS Code is missing from the menu, choose Other and locate Visual Studio Code.app in Applications. Install and open VS Code first if needed.
• If only styles.css changed, repeat the steps and choose Change All. Open With from the context menu alone is useful for a one-time choice.
• SCSS and Less are separate file types. Repeat the change for .scss or .less if you want those files to use the same editor.

Common questions