raster-to-clean-svg
Installation
SKILL.md
Reconstruct raster artwork as clean SVG
Infer the simplest design system that explains the pixels, rebuild it as intentional geometry, and compare an exact-size render with the source. Preserve domain structure rather than tracing export noise.
Output contract and modes
- Keep the source raster immutable. Use its width and height as the SVG
viewBoxwhenever practical so one unit equals one source pixel. - Native-vector mode is the default: deliver editable primitives and deliberate paths, with no embedded raster,
<image>, Base64 payloads, or external image dependencies. Preserve true holes, negative space, layer order, and intentional gradients/shadows. Respect a user's statement that fills are plain. - Hybrid output is outside native-vector mode: use it only when the user explicitly requests or permits raster-backed texture. Existing explicit permission is sufficient; disclose which parts are raster-backed and that the result is not fully native vector. The bundled validator enforces native mode and rejects hybrid files; do not bypass it or label hybrid output as passing native checks. Validate authorized hybrid XML, dependencies, dimensions, and rendered appearance separately with an appropriate renderer.
- Use local reconstruction for this native-SVG task. Do not substitute ImageGen or generic autotracing for editable geometry. Follow an explicit change in the user's requested output mode.
- Validate syntax and appearance before handoff. Describe the result as reconstructed visible design; original control points and layer metadata cannot be recovered from pixels alone.
Reconstruction loop
- Inspect: view the source and necessary crops; establish dimensions, transparency/background, components, colors, repeated geometry, symmetries, and stacking. Derive requested variants from the brief. Keep task-local masks/renders separate from deliverables.
- Model: choose topology before fitting coordinates, using the table below. For a simple solid circle or rounded tile, direct center/radius/bounds measurements can be enough; the probe and detailed references are optional when they would not resolve uncertainty.
- Build: establish main anchors and large silhouettes, then holes and internal layers. Share parameters for repeated elements. Use lines for straight spans and a small number of Bézier nodes for bends. Fit low-dimensional parameters instead of hundreds of contour points.
- Compare: render at the original dimensions, inspect side-by-side, directional mask differences, and zoomed residuals. For transparent sources compare alpha geometry separately from RGB appearance composited onto identical backgrounds.
- Refine: fix silhouette, placement/scale, spacing, corners/caps, overlaps, then colors and effects. Escalate model complexity only for coherent visible residuals. Stop when meaningful discrepancies are resolved and remaining differences are attributable to source uncertainty or rasterizer antialiasing; document those limits instead of chasing a universal metric threshold.