Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>code-svgNew to Visual Studio Code? Get it now.
code-svg

code-svg

BonnyAD9

|
395 installs
| (0) | Free
Advanced svg manipulation in code and preview.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

code-svg README

VSCode extension with advanced features that help making and editing raw svg files.

image

Features

  • advanced preview
    • auto update on save (it retains its state (zoom, position, ...))
    • change background (transparent, white, black, bright checkerboard, dark checkerboard), choose background everywhere or only behind the svg
    • zoom in/out, move around
    • show the user coordinates, right-click to make the coodinates stay after moving mouse
    • reset to default zoom and position
    • preview button

Planned features

  • Better syntax highlighting
  • Better intelisense
  • Select svg elements to do operations on them (move, rotate, mirror, ...)

Requirements

  • none

Extension Settings

  • svg.preview.retainState, disable this to reset the preview state when it goes to background, (disable for less used resources)

Known Issues

  • none

Release Notes

v0.0.1

  • The first release!!!
  • advanced preview
    • auto update on save (it retains its state (zoom, position, ...))
    • change background (transparent, white, black, bright checkerboard, dark checkerboard), choose background everywhere or only behind the svg
    • zoom in/out, move around
    • show the user coordinates, right-click to make the coodinates stay after moving mouse
    • reset to default zoom and position
    • preview button

How to get it

It is available on the VSCode marketplace

Links

  • Author: BonnyAD9
  • Marketplace: code-svg
  • GitHub Repository: code-svg
  • My website: bonnyad9.github.io
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft