VOOZH about

URL: https://www.geeksforgeeks.org/html/svg-a-element/

⇱ SVG <a> Element - GeeksforGeeks

  • Courses
  • Tutorials
  • Interview Prep

SVG <a> Element

Last Updated : 15 Jul, 2025

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

Syntax:

<a href="" 
 target="" 
 type="" 
 rel="" 
 download="">
</a>

SVG <a> 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 <a> Element

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

Output:

👁 SVG a tag Example 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 (<a>) tag, creating a clickable area that redirects to another tab at "geeksforgeeks.org" using target blank upon click.

Output:

👁 svg <a> example output
Svg a tag example Output

Supported Browsers

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

Comment
Article Tags: