vscode-svgviewer
vscode-svgviewer copied to clipboard
SVG Viewer for Visual Studio Code
Japanese Readme
vscode-svgviewer
SVG Viewer for Visual Studio Code Visual Studio Marketplace
Easy way to preview
Viewing an SVG file from explorer context menu.
Usage
- Press Ctrl+P and type
ext install SVG Viewer
with a trailing space. - Press Enter and restart VSCode.
- Open a SVG File.
- Choose process from
Command Palette
orShortcut
.
View SVG - Alt+Shift+S O
Display SVG on an Editor
Zoom in/out
Holding ctrl/cmd and using mouse wheel(up/down)
Export PNG - Alt+Shift+S E
Convert from SVG to PNG
Export PNG with explicitly size - Alt+Shift+S X
Convert from SVG to PNG with explicitly size
Copy data URI scheme - Alt+Shift+S C
Convert from SVG to data URI scheme and copy to the clipboard
View SVG and export PNG by Canvas - Alt+Shift+S V
Display and Convert Thanks @kexi
Options
The following Visual Studio Code setting is available for the SVG Viewer. This can be set in User Settings
or Workspace Settings
.
{
// Show Transparency Grid
"svgviewer.transparencygrid": true,
// Open or not open the preview screen automatically
"svgviewer.enableautopreview": true,
// How to open the screen (vscode.ViewColumn)
"svgviewer.previewcolumn": "Beside",
// Color setting for transparency
"svgviewer.transparencycolor": "#2BD163",
// Show zoom in/out button in preview windows
"svgviewer.showzoominout": true
}