Have a small logo PNG and need it at a larger size? See how Vectali handles edges, tiny details and shading in six real examples. Then preview your own file before you download.
Switch to ImageTracer to compare the actual SVGs. We ran its Default and Detailed presets on every example, with no per-logo tuning. See how each handles curves, small details and shading. Settings & method ↗
Compare
Background
01 React
Thin rings stay open.
The center dot and gaps between the rings stay intact. Line thickness changes slightly at the crossings. If your logo has overlapping lines, zoom in on those junctions.
Before128 × 128 PNG
VectaliAutomatic · SVG
ImageTracerDefault · 16 colors
ImageTracerDetailed · 64 colors
Both ImageTracer presets keep the rings and center, with visibly rougher, uneven edges at this input size. Detailed reduces some of the blockiness but adds many small color regions. Vectali is smoother here, with its own thickness changes at the crossings.
Higher shape overlap means more matching area. Lower edge and color errors are better. None is an overall quality score. How we measure
The central dot, rings and enclosed gaps are retained. Small changes in ring thickness and curves remain around the crossings; inspect the enlarged view against the original.
Both ImageTracer presets keep the rings and center, with visibly rougher, uneven edges at this input size. Detailed reduces some of the blockiness but adds many small color regions. Vectali is smoother here, with its own thickness changes at the crossings.
The small tail marks stay separate in this result. Their curves remain approximate, so compare tiny details with the original before using your SVG.
Before128 × 128 PNG
VectaliAutomatic · SVG
ImageTracerDefault · 16 colors
ImageTracerDetailed · 64 colors
Vectali retains the small tail marks in this run; their shapes remain approximate. ImageTracer loses or changes several marks and leaves uneven circle and face edges. Detailed reduces some larger steps. Inspect the tiny marks rather than relying only on the large silhouette.
Higher shape overlap means more matching area. Lower edge and color errors are better. None is an overall quality score. How we measure
The tiny tail marks are retained: all eight reference foreground components match on this evaluation grid. Their exact contours remain approximate, and the larger silhouette has small curve differences. Component matching is not proof of perfect reconstruction.
Vectali retains the small tail marks in this run; their shapes remain approximate. ImageTracer loses or changes several marks and leaves uneven circle and face edges. Detailed reduces some larger steps. Inspect the tiny marks rather than relying only on the large silhouette.
The rounded shapes, shaded fills and both eye holes remain. The soft shadow still disappears. Check light and dark backgrounds if your logo uses translucent lighting.
Before128 × 128 PNG
VectaliAutomatic · SVG
ImageTracerDefault · 16 colors
ImageTracerDetailed · 64 colors
ImageTracer retains shading and a trace of the shadow as color bands. Detailed keeps more tonal variation, with rough boundaries still visible. Vectali uses smoother gradient fills and contours here, but still loses the soft shadow.
Higher shape overlap means more matching area. Lower edge and color errors are better. None is an overall quality score. How we measure
The blue and yellow shaded fills and both eye holes are retained. The soft shadow still disappears. Compare on light and dark backgrounds before using artwork with translucent lighting.
ImageTracer retains shading and a trace of the shadow as color bands. Detailed keeps more tonal variation, with rough boundaries still visible. Vectali uses smoother gradient fills and contours here, but still loses the soft shadow.
The central opening stays clear and the earlier band seams are removed. Shallow shading at the folds remains approximate. Zoom in on joins when your logo has a layered design.
Before128 × 128 PNG
VectaliAutomatic · SVG
ImageTracerDefault · 16 colors
ImageTracerDetailed · 64 colors
All three outputs keep the central opening. ImageTracer has uneven outer edges; Detailed adds tonal variation around the folds. Vectali removes the earlier central band seams, although shallow fold shading remains approximate.
Higher shape overlap means more matching area. Lower edge and color errors are better. None is an overall quality score. How we measure
The main opening remains clear. Regional gradients remove the earlier central band seams; the shallow fold shading is still approximate and the contours are not identical to the original.
All three outputs keep the central opening. ImageTracer has uneven outer edges; Detailed adds tonal variation around the folds. Vectali removes the earlier central band seams, although shallow fold shading remains approximate.
The round outline and smooth shaded fills stay close to this historical original. Subtle color differences remain. Compare gradients as well as outlines before using the export.
Before128 × 128 PNG
VectaliAutomatic · SVG
ImageTracerDefault · 16 colors
ImageTracerDetailed · 64 colors
ImageTracer represents shading as visible bands, with more tonal steps in Detailed and uneven circular edges. Vectali uses smooth gradients here and has lower measured color error for this particular input; that is not a general engine ranking.
Higher shape overlap means more matching area. Lower edge and color errors are better. None is an overall quality score. How we measure
The circular outline and shaded fills, including the blue center, remain close on this historical artwork. Subtle tone and contour differences remain; this is not current Chrome brand artwork.
ImageTracer represents shading as visible bands, with more tonal steps in Detailed and uneven circular edges. Vectali uses smooth gradients here and has lower measured color error for this particular input; that is not a general engine ranking.
All four panes and their gaps stay separate. The SVG is larger than this tiny PNG. Choose SVG when you need scalable shapes; a smaller file isn’t guaranteed.
Before128 × 128 PNG
VectaliAutomatic · SVG
ImageTracerDefault · 16 colors
ImageTracerDetailed · 64 colors
Both engines keep the four panes and gaps, and the difference is subtle at normal size. ImageTracer slightly changes the boundaries on the evaluation grid. All these SVGs are larger than the input PNG; neither format guarantees a smaller file.
Higher shape overlap means more matching area. Lower edge and color errors are better. None is an overall quality score. How we measure
All four panes and their separating gaps remain. The foreground mask matches on this evaluation grid; a 100% overlap reading does not establish perfect vector geometry or identical color at every scale.
Both engines keep the four panes and gaps, and the difference is subtle at normal size. ImageTracer slightly changes the boundaries on the evaluation grid. All these SVGs are larger than the input PNG; neither format guarantees a smaller file.
A few answers about the engine and this comparison.
Does Vectali use ImageTracer?
No. Vectali uses a custom Rust vectorization engine, with its own color-region, contour-smoothing and curve-fitting pipeline. It runs as WebAssembly for browser conversions, and the API uses the same Rust engine. ImageTracer does not power the current converter.
How is Vectali different from ImageTracer?
ImageTracerJS is an open-source JavaScript tracer with adjustable palettes, tracing thresholds and presets. Vectali uses its custom Rust pipeline and automatic color selection. Both produce SVG paths. The comparisons above show the differences on the same PNGs, including where each loses detail or shading.
Is Vectali always better?
We don’t claim that. Vectali has smoother outlines in these examples, while ImageTracer retains some shading that Vectali flattens. Settings and input size affect both. Try your own file and inspect the details that matter to your design.
Were either engine’s results touched up?
No. Every SVG is the raw engine output. All six PNGs go through Vectali’s automatic mode and ImageTracer’s published Default and Detailed presets. ImageTracer’s viewBox option is enabled for responsive display; its tracing settings are unchanged. The original files, settings and measurements are downloadable.
Before you use your SVG
Give your logo a quick check.
01
Enlarge it.
Look along curves, corners and joins. Check that small gaps stay open.
02
Compare the colors.
Look for missing accents, changed shading or a shadow you need to keep.
03
Try your background.
Place the preview on light and dark surfaces. Check transparency and contrast.
Your file is the one that matters
See how your own logo converts.
Upload a PNG or JPG and inspect your SVG preview for free.
