Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>SVG ToolkitNew to Visual Studio Code? Get it now.
SVG Toolkit

SVG Toolkit

fabioc-aloha

| (0) | Free
SVG utilities for VS Code — inline preview, optimize with SVGO, generate from templates, and copy as data URI
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

SVG Toolkit

SVG Toolkit Banner

SVG utilities — inline preview, data URI copy, icon templates, and basic validation

VS Code

Right-click any .svg file in the Explorer for quick actions. Or use commands from the Command Palette.

Features

  • Inline SVG preview — render any SVG in a VS Code side panel instantly
  • Data URI copy — copy data:image/svg+xml;base64,... for use in CSS or HTML
  • Markdown image copy — paste directly as an inline Markdown image
  • Icon templates — insert circle, checkmark, arrow, or star starter SVG
  • Validation — check for required svg, viewBox, and xmlns attributes
  • Right-click context menu — Explorer right-click for Preview and Copy actions

Requirements

No external tools required. Works entirely within VS Code.

Commands

Command Description
SVG Toolkit: Preview SVG Render SVG in a side panel
SVG Toolkit: Copy as Data URI Copy data:image/svg+xml;base64,...
SVG Toolkit: Copy as Markdown Image Copy as inline Markdown image
SVG Toolkit: Insert Icon Template Insert circle, checkmark, arrow, or star template
SVG Toolkit: Validate SVG Check for <svg>, viewBox, xmlns

Context Menu

Right-click .svg files in Explorer for Preview SVG and Copy as Data URI.


🔷 CX Tools Suite

Explore more tools from the same suite:

Extension Description Marketplace
AI Voice Reader Read files, selections, or documents aloud with Web Speech API Install ↗
Brandfetch Logo Fetcher Fetch and insert brand logos from any domain — SVG, PNG, or Markdown Install ↗
Dev Wellbeing Posture, eye-strain, and hydration reminders for long coding sessions Install ↗
Focus Timer Pomodoro-style focus and break timer with status bar countdown Install ↗
Gamma Slide Assistant Export Marp Markdown presentations to HTML and PDF Install ↗
Hook Studio Visual editor for VS Code hook conditions and automation rules Install ↗
Knowledge Decay Tracker Track staleness of documentation and flag overdue reviews Install ↗
Markdown to Word Convert Markdown + Mermaid diagrams to .docx via Pandoc Install ↗
MCP App Starter Scaffold Model Context Protocol servers in TypeScript, JavaScript, or Python Install ↗
Mermaid Diagram Pro Preview, export, and validate Mermaid diagrams in Markdown files Install ↗
PPTX Builder Generate PowerPoint presentations from Markdown using pptxgenjs Install ↗
Replicate Image Studio Generate images and videos with FLUX, SDXL, and WAN via Replicate API Install ↗
SecretGuard Scan workspaces and files for accidentally committed secrets and keys Install ↗
SVG to PNG Convert SVG files to PNG using resvg-js (Rust renderer, no ImageMagick) Install ↗
SVG Toolkit (this) Preview, copy as data URI, and validate SVG files in-editor Install ↗
Workspace Watchdog Monitor file health, detect stalled work, and surface hot files Install ↗

License

MIT

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