Web Tools tools.bryantsmith.com

Images & SVG

SVG Icon Preview Sheet

Paste one or many SVG icons — or choose .svg files — and preview them in a searchable, labeled grid. Click any icon to copy its markup, then export the whole set as an SVG sprite. Everything stays in your browser.

Runs in your browser v1.0.0

Icons

markup or files

Every complete <svg>…</svg> becomes one icon. Labels come from <title>, aria-label or id; prefix a line with name: (or <!-- name -->) to name it yourself.

Preview

0 icons
Background

Paste SVG markup or choose files to build a sheet.

How it works

Your icons are parsed in the browser with DOMParser, never uploaded. Each <svg> block is sanitized first — scripts, event handlers, foreignObject content and remote URLs are stripped so pasted code cannot run and no network requests are made. Click a tile to copy that icon, or download the complete set as a sprite sheet of <symbol> elements ready for <use href="#name">.

Related tools

  • Social Image Safe-Area PreviewPreview artwork against common social sharing crops and text-safe regions, entirely in your browser.
  • SVG Sprite BuilderCombine uploaded SVG icons into a single reusable symbol sprite, entirely in your browser.
  • Base64 Image ConverterConvert an image to a Base64 data URI or decode a data URI back into a downloadable image — all in your browser.
  • Favicon GeneratorTurn one source image into favicon.ico, PNG icons, a web app manifest and copy-ready HTML link tags — entirely in your browser.
  • Image CompressorCompress images in your browser with a live before/after quality comparison and instant size savings.
  • Image CropperCrop images in your browser with freeform handles, exact pixel fields, or common aspect ratio presets.

More Images & SVG tools