DEVELOPER TOOL

SVG Sprite Generator

Drop your SVG icons, combine them into an optimized sprite sheet with <symbol> elements, and get ready-to-use code.

100% Client-Side No Upload Privacy First

Drop SVG files here or click to browse

Add as many icons as you need

Icons

No icons added yet

Preview appears when icons are added

Symbol ID Prefix

Remove fills

Strip fill attributes for CSS control

Remove dimensions

Strip width/height for scalable symbols

Clean metadata

Remove comments, titles, metadata

SVG Sprite

<!-- Add icons above to generate sprite code -->

HTML Usage

<!-- Usage examples appear here -->

SVG sprites combine multiple icons into a single file using <symbol> elements. Each symbol gets a unique ID.

Reference any icon with <use href="#id"> — one HTTP request, all icons. Style with CSS using currentColor.

Inline the sprite in your HTML, or reference an external .svg file. Both patterns are shown in the code output.

Copied!

Custom mockup images for design

Compress images with visual comparison

Convert between HEX, RGB, HSL and more