Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>svg-inline-previewNew to Visual Studio Code? Get it now.
svg-inline-preview

svg-inline-preview

Riceball

|
1 install
| (0) | Free
Show SVG preview inline
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

SVG Inline Preview

Displays a preview of SVG code inline, as a gutter icon.

logo

Features

  • Live Preview: See your SVG changes in real-time.
  • Gutter Icon: The SVG preview is conveniently displayed in the gutter, next to your code.
  • Customizable Background: Change the background color of the SVG preview to match your theme.

How to Use

  1. Install the extension from the VS Code Marketplace.
  2. Open a file containing SVG code.
  3. The SVG preview will automatically appear in the gutter.

Configuration

You can customize the background color of the SVG preview by changing the following setting in your settings.json file:

{
    "svg-inline-preview.backgroundColor": "#FFFFFF"
}

Contributing

If you have any suggestions or find any bugs, please feel free to open an issue or submit a pull request on the GitHub repository.

License

This extension is licensed under the MIT License.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft