A small VS Code extension for previewing inline SVG elements in TSX files.
Try it in VS Code or Cursor
Open this folder in VS Code or Cursor.
Press F5 to open an Extension Development Host window.
Open a TSX file containing a complete inline <svg> element.
Click the eye button in the editor title bar. It only appears for TSX files containing a complete SVG.
The preview selects the SVG containing the cursor. If the cursor is outside an SVG, it previews the next SVG in the file, then falls back to the first one. The preview updates as you edit the source file.
The preview handles static SVG JSX, literal values such as width={32}, and spread props such as {...props}. Dynamic JavaScript expressions are omitted.
Package for installation
Run npx @vscode/vsce package in this directory to create a .vsix file. Install it from the Extensions view using Install from VSIX....
To publish, dilanx must be a registered Visual Studio Marketplace publisher, and the publisher account must provide a Personal Access Token to vsce publish. The extension is prepared for packaging; it has not been published.