How to use the Vector Engine
Turn a PNG or JPG into clean SVG vector art, right in your browser.
Quick start
- Load an image — click the Original Source box and pick a PNG/JPG, or drag an image onto it. Your image appears in the box so you can confirm it’s the right one.
- Set the options — start with Quality Level at 5 and adjust the rest to taste (see the table below).
- Click “Generate SVG.” The result appears in the Vector Output box.
- Download it — Download SVG for a scalable vector file, or Download PNG for a high‑resolution image.
The controls
| Control | What it does |
|---|
| Original Source box | Your input. Click the box or drag a PNG/JPG onto it; the loaded image is shown there. Click it again any time to choose a different file. |
| Quality Level (1–10) | One master dial. Higher levels use a larger working resolution, more colors, and finer detail (slower, larger files). Lower levels are faster and simpler. It auto‑sets the tone count and fill size. |
| Source Type | Photo / Art — Organic Contours keeps organic, textured contours. Flat Graphic — Signs, Logos, Text snaps to the image’s actual flat colors and traces clean edges. |
| Detail Distribution | Center Detail keeps the middle sharp and simplifies the edges. Overall Detail applies detail evenly across the image. |
| Color Quantization | How many tones the output is reduced to — from 4 (bold poster look) up to 64 (maximum fidelity). |
| Color Randomness (0–100%) | Adds per‑shape color variation for a hand‑made feel. Leave at 0% for exact colors. |
| Polygon Fill Size (1–200px) | How aggressively tiny regions are merged. Smaller = more detail and more shapes; larger = simpler output. |
| Paint Texture (On/Off + slider) | Gives the shapes an organic, brush‑like wobble. The slider sets how strong the effect is. Updates the preview instantly. |
| Canvas Texture (On/Off + slider) | Lays a subtle paper/canvas grain over the art. The slider sets the grain strength. |
Output
| Button | What it does |
|---|
| Generate SVG | Builds the vector from your current settings and shows it in the Vector Output box. |
| Download SVG | Saves a scalable vector file — best for editing or scaling to any size. |
| Download PNG | Saves a raster image at 2× the original image’s resolution — best for sharing or printing. Any textures are baked in. |
Tips
- Logos & text: choose Flat Graphic and a higher Quality for crisp edges and thin strokes.
- Photos & illustrations: use Photo / Art; try 8–16 tones and a little Color Randomness for character.
- Textures: Paint and Canvas update the preview live and are included in both the SVG and PNG downloads. Note that some vector editors (e.g. Illustrator) may rasterize the textured SVG — the PNG always preserves the look.
- Big files / slow generate: drop the Quality Level a notch — it lowers the working resolution and shape count.
- Everything runs in your browser. Your image never leaves your computer.