Inkscape SVG vs Plain SVG: A Diagnostic Guide for Consistent Rendering

Problem Statement

When artwork created in Inkscape looks fine in the editor but changes shape, color, or text when opened in a browser or another vector editor, the culprit is often the SVG format chosen for export. Inkscape can write two distinct variants of SVG: Inkscape SVG (the editor’s native format) and Plain SVG (an interchange‑oriented format that strips editor‑specific data). Choosing the wrong format can break layout, hide text, or inflate file size.

Symptom‑to‑Cause Table

Symptom	Likely Cause
Geometry shifted, rotated, or resized	Active path effect not applied by the target renderer
Text reflowed, clipped, or missing	Flowed text or missing font on the viewing system
Object invisible or wrong color	Unsupported filter, blend mode, or Inkscape‑specific attribute
File unexpectedly large	Retained metadata, namedview data, and unused defs in Inkscape SVG

Ordered Checks

1. Open the exported file in a browser and a non‑Inkscape editor. Note any visual differences. This quick check shows whether the issue is global or renderer‑specific.
2. Inspect the root element for namespaced attributes. In a text editor, look for attributes starting with inkscape: or sodipodi:. Their presence indicates an Inkscape SVG.
3. Identify live path effects. In Inkscape, select the object and view the Path > Path Effects panel. If the panel shows an active effect, the effect’s data will survive only in Inkscape SVG.
4. Check text objects. Select each text item. If the panel shows Flowed Text or Text Path, the text will be preserved only in Inkscape SVG.
5. Verify font availability. In the browser’s dev tools, look for font-family declarations. If the font is missing, the browser substitutes or hides the text.

Fixes Tied to Findings

• Live Path Effects: Use Path > Break Apart or Path > Flatten Path Effects to bake the effect before export.
• Flowed Text: Convert to regular text with Text > Convert to Text or Text > Convert to Path if the font cannot be guaranteed on the target system.
• Missing Fonts: Either embed the font in the SVG (File > Document Properties > Fonts) or convert the text to paths.
• Unsupported Filters/Blend Modes: Replace them with simpler equivalents or pre‑render the object to a raster image if the target renderer cannot handle them.
• Large File Size: Re‑save as Plain SVG and delete unused <defs> blocks manually.

Escalation Criteria

If the geometry changes even after exporting as Plain SVG with all effects baked, or if the same file renders differently in two modern browsers, the problem likely lies outside Inkscape’s export options. Possible next steps:

• Check the target renderer’s SVG support matrix.
• Verify color profiles and opacity handling in the print pipeline.
• Consult the target application’s documentation for known SVG quirks.

Recommended Workflow

Maintain a two‑artifact pipeline:

1. Keep the Inkscape SVG as the master source. Edit and iterate here, preserving all Inkscape‑specific data.
2. Generate a Plain SVG (or an optimized derivative) on demand for distribution. Use File > Save As and select Plain SVG or run inkscape --export-plain-svg=output.svg input.svg.
3. Never edit the Plain SVG directly; instead, modify the master and regenerate.

Limitations & Practical Checks

• Plain SVG does not guarantee identical rendering; filters and CSS may still behave differently across renderers.
• Converting text to paths removes editability and may alter glyph metrics; keep the original text for future edits.
• Some Inkscape features have no direct SVG equivalent; rendering will depend on the target’s feature support.
• Verify the Inkscape version: menu labels and export options vary between releases. Check Help > About Inkscape.
• To confirm that the export produced the intended format, open the file in a text editor and look for xmlns:inkscape in the root element.

Concrete Example

Create a 10 × 10 mm square, apply a Offset Path effect, and add a flowed text line. Save as both Inkscape SVG and Plain SVG. Open the Plain SVG in Chrome and note that the offset is flattened but the flowed text becomes ordinary text. Open the Inkscape SVG in Inkscape and observe that the offset still appears as an effect and the text remains flowed. This confirms the diagnostic steps above.