What's the difference between both these SVG's?

Both codes are set up differently, is there a specific name you would call each of them?

1.)

<svg width="100" height="100">
   <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>

2.)

<svg style= "background-color:#cfc;" width="100" height="100" viewBox="0 -3 100 106"><path fill="currentColor" style="fill:black;stroke: orange; stroke-width:3px;" d="M81 44.6c5 3 5 7.8 0 10.8L9 98.7c-5 3-9 .7-9-5V6.3c0-5.7 4-8 9-5l72 43.3z"></path></svg>

What do you mean by “name”? You want to know how to reference these codes to others so they know what you are talking about?

One obvious difference is that the circle uses simpler code to define the circle. The triangle needs more code to define all its points.

So, there’s no specific name, defined term you would call each.

They are just SVG images.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.