DEV Community

Cover image for We Benchmarked GPT-Image-2.6 Native <svg> Output: Path Counts, Cost & Real Edge Cases
Kevin
Kevin

Posted on

We Benchmarked GPT-Image-2.6 Native <svg> Output: Path Counts, Cost & Real Edge Cases

#svg #webdev #typescript #showdev

Most "AI vector generators" over the past two years did the exact same thing under the hood: generate a raster PNG, then run an aggressive auto-tracer over it—leaving you with 1,800 jagged <path> nodes and muddy gradients that bog down Figma.

With gpt-image-2.6 adding native output_format: "svg" support, we ran a structured benchmark while building GPTSVG Studio to see whether native LLM-authored <svg> geometry is actually clean enough for production frontend and brand work.

All raw .svg sample outputs, rendered previews, and our standalone zero-dependency TypeScript XML AST sanitizer are open-sourced under MIT here:
👉 GitHub Benchmark & Sanitizer Repo: https://github.com/keokeo/gpt-image-2-6-svg-benchmark

3 Things We Learned from Real API Runs

  1. Text-to-SVG produces semantic <g id="..."> layers—not traced soup Across minimal geometric logos, monoline 24×24 UI icons, lettermarks, and shield badges, native SVG output averaged 4 to 18 closed paths (0.9 KB – 9.6 KB), zero embedded data:image/png bitmaps, and readable group IDs:

| Preset | Quality | Raw Size | Elements / Paths | Embedded Raster |
| :--- | :--- | :--- | :--- | :--- |
| Minimal Geometric Logo | medium | 1.4 KB | 6 elements | 0 |
| Wordmark + Mark | medium | 2.1 KB | 9 elements | 0 |
| 24×24 Monoline UI Icon | low | 0.9 KB | 5 strokes | 0 |
| Die-Cut Sticker | medium | 9.6 KB | 28 paths | 0 |
| Shield / Crest Badge | low | 1.9 KB | 8 paths | 0 |

  1. Native output_format: "svg" is strictly Text-to-SVG
    Upstream providers currently restrict native SVG output to text prompts; image-edit endpoints reject output_format: "svg". For Image to SVG conversion, we paired a zero-upload client-side Web Worker k-means vectorizer (free, runs 100% locally in your browser) with an optional flat-palette AI redraw pass.

  2. Never inject LLM-generated SVG with innerHTML
    Inline <svg> is executable XML. Treat model-generated SVG as untrusted input: parse it into an XML AST, rebuild only allow-listed geometry tags/attributes (stripping <script>, <foreignObject>, on* handlers, and external href references), serve stored files with Content-Security-Policy: default-src 'none'; sandbox, and render previews via <img src="blob:...">.

Try the Free Local Vectorizer or Inspect Sample SVGs

Happy to share raw SVG snippets or sanitizer edge cases if anyone else is building vector tooling!

Top comments (0)