How do I install the Png To Svg skill?

Run npx skillmds@latest add rajnandan1/png-to-svg in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Png To Svg safe to use?

This skill has not completed SkillMD's automated safety review yet. Capability flags: executes scripts. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Png To Svg?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Png To Svg free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Png To Svg?

rajnandan1 (@rajnandan1) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Png To Svg by rajnandan1 — Agent Skill

Name: Png To Svg
Author: rajnandan1

Png To Svg

Convert PNG images to smooth, scalable SVG vector files using potrace tracing. Supports multi-color PNGs (logos, icons, illustrations) by extracting dominant colors and tracing each color layer separately, then compositing into a clean SVG. Also handles single-color images and lets users override the fill color. Use this skill whenever the user wants to: convert a PNG to SVG, trace a bitmap, vectorize an image or logo, turn a raster image into vectors, create an SVG from a PNG/JPEG/bitmap, or anything involving bitmap-to-vector conversion. Also trigger when the user mentions "potrace", "image tracing", or asks to make an image scalable.

rajnandan1 Updated Sep 17, 2026

File contents

PNG to SVG Converter

Convert raster PNG images into smooth, clean SVG vector files. The skill uses ImageMagick for image preprocessing and potrace for bezier curve tracing, producing SVGs with smooth paths that scale to any size.

Prerequisites

Two command-line tools are needed. If either is missing, install them:

brew install imagemagick potrace

How to use

There's a bundled script at scripts/png2svg.sh that handles the full pipeline. Run it directly:

bash <skill-path>/scripts/png2svg.sh <input.png> [output.svg] [OPTIONS]

Options

Flag	Description	Default
`--single-color`	Force single-color trace instead of multi-color	off (multi-color)
`--color "#hex"`	Override the fill color	auto-detected
`--threshold N`	Grayscale threshold 0-100 (higher = more detail)	50
`--smoothness N`	Curve smoothness 0-1.334 (higher = smoother)	1.334

Examples

Simple single-color logo:

bash <skill-path>/scripts/png2svg.sh logo.png logo.svg --single-color

Multi-color illustration (default):

bash <skill-path>/scripts/png2svg.sh artwork.png artwork.svg

Override color:

bash <skill-path>/scripts/png2svg.sh icon.png icon.svg --color "#FF5733"

Adjust for detailed images:

bash <skill-path>/scripts/png2svg.sh detailed.png --threshold 60 --smoothness 1.0

What the script does

Color extraction — Samples the PNG's dominant colors (up to 8) using ImageMagick's histogram, skipping near-white and near-black (background colors).
Per-color tracing — For each detected color, isolates matching pixels using fuzz matching, converts to a binary bitmap, then traces with potrace using smooth bezier curves.
SVG composition — Combines all traced color layers into a single SVG, with each layer using its original fill color.
Cleanup — Removes the background rectangle that potrace adds (the full-canvas M0 path), and deletes all temporary files.

When things don't look right

The two most impactful parameters to tweak are:

Threshold (--threshold): If the SVG is missing detail, increase this (try 60-70). If it's too noisy, decrease it (try 30-40).
Smoothness (--smoothness): The default 1.334 gives very smooth curves. Lower values (0.5-1.0) preserve more sharp corners, which is better for pixel art or geometric designs.

For images with transparency (like PNGs with alpha channels), the script handles this automatically — transparent areas become empty space in the SVG.

Limitations

Works best with logos, icons, illustrations, and graphics with solid color areas
Photographic images will lose detail (this is inherent to tracing — photos are better as embedded raster)
Very fine text may not trace cleanly; consider using actual SVG text elements for text
JPEG input: rename to .png or convert first with magick input.jpg input.png

---name: png-to-svgdescription: Convert PNG images to smooth, scalable SVG vector files using potrace tracing. Supports multi-color PNGs (logos, icons, illustrations) by extracting dominant colors and tracing each color layer separately, then compositing into a clean SVG. Also handles single-color images and lets users override the fill color. Use this skill whenever the user wants to: convert a PNG to SVG, trace a bitmap, vectorize an image or logo, turn a raster image into vectors, create an SVG from a PNG/JPEG/bitmap, or anything involving bitmap-to-vector conversion. Also trigger when the user mentions "potrace", "image tracing", or asks to make an image scalable.---# PNG to SVG ConverterConvert raster PNG images into smooth, clean SVG vector files. The skill uses ImageMagick for image preprocessing and potrace for bezier curve tracing, producing SVGs with smooth paths that scale to any size.## PrerequisitesTwo command-line tools are needed. If either is missing, install them:```bashbrew install imagemagick potrace```## How to useThere's a bundled script at `scripts/png2svg.sh` that handles the full pipeline. Run it directly:```bashbash <skill-path>/scripts/png2svg.sh <input.png> [output.svg] [OPTIONS]```### Options| Flag | Description | Default ||------|-------------|---------|| `--single-color` | Force single-color trace instead of multi-color | off (multi-color) || `--color "#hex"` | Override the fill color | auto-detected || `--threshold N` | Grayscale threshold 0-100 (higher = more detail) | 50 || `--smoothness N` | Curve smoothness 0-1.334 (higher = smoother) | 1.334 |### Examples**Simple single-color logo:**```bashbash <skill-path>/scripts/png2svg.sh logo.png logo.svg --single-color```**Multi-color illustration (default):**```bashbash <skill-path>/scripts/png2svg.sh artwork.png artwork.svg```**Override color:**```bashbash <skill-path>/scripts/png2svg.sh icon.png icon.svg --color "#FF5733"```**Adjust for detailed images:**```bashbash <skill-path>/scripts/png2svg.sh detailed.png --threshold 60 --smoothness 1.0```## What the script does1. **Color extraction** — Samples the PNG's dominant colors (up to 8) using ImageMagick's histogram, skipping near-white and near-black (background colors).2. **Per-color tracing** — For each detected color, isolates matching pixels using fuzz matching, converts to a binary bitmap, then traces with potrace using smooth bezier curves.3. **SVG composition** — Combines all traced color layers into a single SVG, with each layer using its original fill color.4. **Cleanup** — Removes the background rectangle that potrace adds (the full-canvas M0 path), and deletes all temporary files.## When things don't look rightThe two most impactful parameters to tweak are:- **Threshold** (`--threshold`): If the SVG is missing detail, increase this (try 60-70). If it's too noisy, decrease it (try 30-40).- **Smoothness** (`--smoothness`): The default 1.334 gives very smooth curves. Lower values (0.5-1.0) preserve more sharp corners, which is better for pixel art or geometric designs.For images with transparency (like PNGs with alpha channels), the script handles this automatically — transparent areas become empty space in the SVG.## Limitations- Works best with logos, icons, illustrations, and graphics with solid color areas- Photographic images will lose detail (this is inherent to tracing — photos are better as embedded raster)- Very fine text may not trace cleanly; consider using actual SVG text elements for text- JPEG input: rename to .png or convert first with `magick input.jpg input.png`

Frequently asked questions