How to Disable SVG Preview Mode

3 ways to open SVG files as text instead of preview mode in Visual Studio Code.

Method 1: Set editor via context menu

1. Locate any .svg file
2. Right-click it and select Open With...
3. Select Configure default editor for '*.svg'...
4. Set **Text Editor" as the default

Method 2: Set editor via settings.json

1. Open Manage menu from the gear icon (⚙️)
2. Go to Settings
3. Open settings.json from the file icon (📃)
4. Add the following snippet:

"workbench.editorAssociations": {
  "*.svg": "default"
}

Method 3: Set editor via GUI

1. Open Manage from the gear icon (⚙️)
2. Go to Settings
3. Search for Workbench.EditorAssociation
4. Click Add Item
5. Enter *.svg in the Item field
6. Enter default in the Value field
7. Click OK to apply

Contact

• YouTube: Vrauuss Softwares
• GitHub: Vrauuss Softwares

Blog

Coming soon…

Article

• YouTube: How to Disable SVG Preview Mode
• DEV.to: How to Disable SVG Preview Mode

References

• Reddit: SVG files open as Preview
• StackOverflow: Unable to import SVG with Vite as React Component