Latest web development tutorials

SVG Round

SVG round - <circle>

<Circle> tag is used to create a circle:

Here is the SVG Code:


<svg xmlns="" version="1.1">
<circle cx="100" cy="50" r="40" stroke="black"
stroke-width="2" fill="red"/>

try it"

For Opera users: view SVG file (right-click on the preview source SVG graphics).

Code analysis:

  • cx and cy attributes define the x and y coordinates of the dots. If you omit the center and cx cy, the circle is set to (0, 0)
  • R attribute defines the radius of the circle