  
Svg Preview for VSCode
Features
- Live editing of svg files and svg's inside files
- Panning and zooming of the preview (up to 32767%)
Commands
| Command |
Keybinding |
| Svg Preview: Open Preview to the Side |
ctrl+alt+p |
| Svg Preview: Reload Preview |
none |
Settings
| Property |
Description |
Default |
| svgPreview.autoOpen |
Automatically open the preview when a svg file is opened |
false |
| svgPreview.scaleToFit |
Whether or not the svg should be scaled to fit the viewport or keep its original size |
true |
| svgPreview.style |
Custom style for the preview |
{} |
How to use the svgPreview.style setting
You can change the background color:
{
"svgPreview.style": {
"html": {
"background": "white"
}
}
}
Or you can make a checkerboard background:
{
"svgPreview.style": {
"html": {
"background-position": "0 0, 13px 13px",
"background-size": "26px 26px",
"background-image": "linear-gradient(45deg, #141414 25%, transparent 25%, transparent 75%, #141414 75%, #141414), linear-gradient(45deg, #141414 25%, transparent 25%, transparent 75%, #141414 75%, #141414)"
}
}
}
| |
