<?xml version="1.0" encoding="utf-8"?>

SVG circle

SVG circle

To create a circular shape with SVG, you need the <circle> element. Like all graphic shapes in SVG, it contains a forward slash — <circle/> — and doesn't require a closure, so you don't have to worry about placing the end tag.

The attributes cx and cy define the circle center coordinates, while the attribute r specifies the radius. However, if you omit the attributes cx and cy, the circle's center is set to the (0,0) point, which corresponds to the upper left-hand corner.

Improve your UX & Product skills with interactive courses that actually work