SVG logo - How to treat group of paths as copy-pastable character?

29 Views Asked by At

This group of paths (made using figma) renders as something representing the letter f

<svg xmlns="http://www.w3.org/2000/svg" width="580" height="180" viewBox="0 0 580 180" fill="none">
    <g id="f" stroke="black" stroke-width="7.99608" stroke-miterlimit="8" stroke-linecap="round">
        <path id="f_body" d="M459 37.763C476.182 32.737 509.41 32.869 509.944 52.842C510.054 65.679 509.947 137.992 510 138" />
        <path id="f_line_bot" d="M469 142H531.332" />
        <path id="f_line_top" d="M469 70H531.332" />
    </g>
</svg>

Is there a way to make sure this "f" can be copy-pasted like a regular <text> element?

<svg xmlns="http://www.w3.org/2000/svg" width="580" height="180" viewBox="0 0 580 180" fill="none">
    <text x="10" y="40" font-family="Arial" font-size="24" fill="black">
        f
    </text>
</svg>

1

There are 1 best solutions below

1
Danny '365CSI' Engelman On

No, the <path> represent a letter F,
even Figma doesn't see an F.

Its you that can read it as an F.

You could write software

  • that hunts down id="f" notatation,
  • parses all path (this will take you same time)
  • and create a textpath,

But doing it by hand for one alfabet is likely faster.