How can I display an image inside SVG circle in HTML5?

HTMLWeb DevelopmentFront End Technology

To display an image inside SVG circle, use the <circle> element and set the clipping path. The <clipPath> element is used to define a clipping path. Image in SVG is set using the <image> element.

Example

You can try to run the following code to learn how to display an image inside SVG circle in HTML5

Live Demo

<!DOCTYPE html>
<html>
<title>HTML5 SVG Image</title>
</html>