Works with the AI Agents you already use

    Claude CodeClaude CodeCursorCursorCodex CLICodex CLIMuseMuseDotsDots+22 more

    Img To SVG

    1

    Convert raster images and design files into editable, optimized SVGs with layer-level control.

    $1.99

    Secure checkout via Stripe

    Money-back guarantee

    Converts to your local currency at checkout

    Security scanned
    Img To SVG

    Img To SVG

    Example session with this skill installed

    Convert logo.png to a vector SVG. Change the blue background (layer-0) to hex #ff5500 and remove the small text at the bottom (layer-4). Optimize for web.

    • Read your context and instructions
    • Compiled the img to svg
    • Generated the UI component

    I have processed logo.png, converted it to a layered SVG, and applied your requested style modifications.

    Vector Conversion and Edit Results

    ActionResultLayer ID
    ConversionSuccess (Layered Mode)N/A
    Background RecolorApplied #ff5500layer-0
    Node RemovalDeleted text elementlayer-4
    OptimizationReduced size by 42%All layers preserved
    <svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
  <path id="layer-0" d="M0 0h512v512H0z" fill="#ff5500"/>
  <path id="layer-1" d="M256 120c-75 0-136 61-136 136s61 136 136 136 136-61 136-136-61-136-136-136z" fill="#ffffff"/>
  <path id="layer-2" d="M280 210l-24 24-24-24-10 10 24 24-24 24 10 10 24-24 24 24 10-10-24-24 24-24z" fill="#ff5500"/>
  <path id="layer-3" d="M256 140c-64 0-116 52-116 116s52 116 116 116 116-52 116-116-52-116-116-116z" fill="none" stroke="#000" stroke-width="2"/>
</svg>

    Next steps

    1. Run render_svg to verify the new #ff5500 color looks correct in your browser.
    2. Check the viewBox dimensions if you plan to embed this in a specific UI container.
    3. Use the generated logo.svg to replace the raster asset in your codebase.

    logo.png

    TSX · React component

    Generated

    Example file from a real run - the skill writes it into your workspace.

    Connects securely to your tools. The creator never sees your data.

    About this skill

    Raster images are static, pixelated, and difficult to modify. This skill converts PNG, JPG, PDF, and AI files into editable SVG paths, allowing for precise control over colors, layers, and geometry.

    What it does

    • Vector conversion turns raster images into SVGs using auto, simple, or layered modes.
    • Vector import extracts paths from PDF, AI, and EPS files while preserving original data.
    • Layer inspection lists addressable IDs with fill, stroke, and bounding box metadata.
    • Structured editing modifies specific layers via command operations like recolor, scale, or remove.
    • Visual verification renders SVGs back to PNG at any stage to confirm accuracy.
    • Optimization cleans up SVG code and minifies file size while keeping layer IDs intact.

    How it works

    1. Source ingestion uses convert_image_to_svg for rasters or import_vector for specialized design files.
    2. Analysis runs inspect_svg to identify the specific layer-N IDs for targeted manipulation.
    3. Refinement applies edit_svg operations to change fills, strokes, or transformations.
    4. Validation executes render_svg to compare the output against the original source image.

    Frameworks & tools

    This skill utilizes an imagetosvg MCP server. It handles standard web formats (PNG, JPG) and professional design formats (AI, EPS, PDF). EPS support requires Ghostscript.

    Why this beats prompting it yourself

    Standard LLM prompts often fail at generating valid, complex SVG paths from scratch or hallucinate visual data. This tool uses specialized conversion engines and a feedback loop that verifies visual output against the source, ensuring the resulting SVG is structurally sound and visually faithful.

    Use cases

    • Logo vectorization from low-resolution PNGs to scalable production assets.
    • UI icon modification by programmatically changing strokes and fills of existing vectors.
    • Asset optimization by cleaning up heavy design files into web-ready SVGs.
    • Graphic isolation by removing backgrounds or specific elements from a layered image.

    Known limitations

    EPS imports require Ghostscript on the system PATH. Layer IDs are assigned in document order. Complex photographic rasters may require high max_colors settings which increases file size.

    How to use

    Skills on Agensi run inside your AI agent. Copy the prompt, paste it into your agent, and it connects to Agensi and installs this skill for you. If a payment is needed, your agent shows it to you first.

    Reviews

    No reviews yet

    Be one of the first to try it. Every listed skill passes our trust checks below.

    Security scanned

    Passed our 8-point scan before listing

    Fresh listing

    Recently published to Agensi

    Money-back guarantee

    Doesn't do what its page promises? You get your money back.

    Trust & safety

    Security scanned

    Verified clean 6 days ago

    • Passed all security checks, Safe to install

    Requires

    Imagetosvg MCP
    Node.js
    vitest

    Listed6 days ago

    What's inside

    Frequently Asked Questions