Three ways to handle fonts in an SVG infographic

• ✗ Path data — no text nodes
• ✗ Invisible to screen readers
• ✗ Not searchable or translatable
• ✓ Visual rendering correct

Note: this demo uses live text styled as system-ui to approximate the visual. A real outlines export contains only <path> elements — the text above is for illustration.

• ✓ Text nodes — accessible
• ✓ Searchable
• ✗ Falls back to Times New Roman
• ✗ Layout may break

• ✓ Real text — fully accessible
• ✓ Searchable and translatable
• ✓ Correct font on every device
• ✓ Editable in the source file