Native SVG Method
Creates pure vector SVG elements (text, rect, line) directly from Markdown.
Pros: Fully scalable, small file size, works in all browsers. Cons: Limited styling compared to HTML. Best for: Simple text documents, diagrams, and charts.
ForeignObject Method
Embeds HTML directly inside an SVG using the foreignObject element.
Pros: Preserves all HTML styling and layout. Cons: May have compatibility issues in some browsers. Best for: Rich text documents with complex formatting.
Canvas Method
Renders HTML to a canvas, then embeds the canvas as an image in SVG.
Pros: High compatibility, visually accurate. Cons: Raster-based (not vector), larger file size. Best for: Complex visual content where appearance matters most.
DOM-to-SVG Method
Uses the dom-to-svg library to convert DOM elements directly to SVG.
Pros: Better vector representation than canvas method. Cons: Complex implementation, may not work in all browsers. Best for: Advanced applications needing vector output from HTML.