CODEWITHSUNDEEP
csssvgpath
Mike Vierwind
Mike Vierwind

Reputation: 1520

Make a SVG Path halve circle

I am new in SVG. I want make this curved stroke: picture of the stroke This picture of the stroke

How can I make that with SVG? I've already done with SVG. But do not get out. Who can help me with this stroke? Thanks for help!

Upvotes: 1

Views: 664

Answers (1)

gotohales
gotohales

Reputation: 3695

It's not perfect, but something like this will give you a good start.

    <svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='200' height='200'>
                <path fill='none' stroke="black" stroke-width='4' d='M 90,80 A60,60 0 0,1 90,5'/>
</svg>

You can see it here in action.

Tweaking the 60,60 values will make it more or less circular. The 90,80 and 90,5 values are the start and end points. The rest should be self explanitory but let me know if you have any questions.

Upvotes: 3

Related Questions