SVG <a> Element (original) (raw)

Last Updated : 15 Jul, 2025

The **SVG element creates a hyperlink within SVG graphics. It functions similarly to the HTML element. It links to external resources or other parts of the SVG document.

**Syntax:

**SVG Attributes

Name	Description
href	It stands for hypertext reference and takes the link to the other documents.
download	It instructs the browser to download a file.
hreflang	It is the human language of the URL or in simple words the URL fragment that hyperlink point is the hreflang.
rel	It tells the relationship between the target and source documents.
target	It tells about where the webpage is to be displayed.
type	It tells about the MIME type of the document linked with URL.
ping	It is the space-separated list of URLs.

Examples of SVG Element

**Example 1: In this example we creates a green circle inside an SVG element. It's wrapped with an anchor () tag, making it a clickable link that redirects to "geeksforgeeks.org" upon click.

HTML `

SVG a Tag

SVG Tag

    <svg width="500" height="500">
        <a href="http://geeksforgeeks.org">
            <circle cx="150" cy="100" r="80" fill="green">
            </circle>
        </a>
    </svg>
</div>

**Output:

SVG a tag Example output

**Example 2: In this example we defines a green rectangle within an SVG element. It's encapsulated by an **anchor () tag, creating a clickable area that redirects to another tab at "geeksforgeeks.org" **using target blank upon click.

HTML `

SVG a Element

Tag SVG

**Output:

svg <a> example output

Svg a tag example Output

**Supported Browsers

The browser supported by value attribute in option tag are listed below: