SVG Element Complete Reference

Last Updated : 23 Jul, 2025

SVG stands for Scalable Vector Graphic. It can be used to make graphics and animations like in HTML canvas. It is a type of vector graphic that may be scaled up or down. Elements are the core things that is required to work with SVGs.

List of SVG Elements:

SVG Elements

Description

The element in SVG is used to create a hyperlink to other webpages or any URL.
The SVG element is used to animate an attribute or property of an element over time.
The element let define how an element moves along a motion path.
The element animates a transformation attribute on its target element.
The SVG element is used to draw circle. The center point and radius are given.
The SVG element is used to define a clipping path that is to be used by the clip-path property.
The in SVG is used whenever we want a particular element to render only when required or when it is called.
The element in SVG is used to provide an accessible text description to any of the available SVG elements whether it is a container or graphic element.
The element is used to create an ellipse.
element is used to combines two images or SVG fragments into a single graphic.
element implements color manipulations on each color channel separately.
The SVG filter primitive changes pixels in the input image with neighboring pixels to produce a resulting image.
The filter primitive lights an image using the alpha channel as a bump map.
The SVG filter primitive is use to spatially displace the image content using a displacement map.
The element works in combination with other filter primitives to add a drop shadow to the graphic.
element generates a layer of continuous color that completely fills this element's filter primitive region.
The element adds a smooth blur to the graphic based on the standard deviation provided in the input primitive.
The SVG filter primitive fetches image data from an external source and provides the pixel data as output.
The SVG element allows filter effects to be applied concurrently instead of sequentially.
The SVG element takes the result of another filter which is to be processed by its parent element i.e. feMerge element.
The element is used to create drop shadow effects.
The filter primitive defines a light source which allows to create a point light effect.
The SVG filter primitive lights a source graphic using the alpha channel as a bump map.
The SVG defines a light source which results in a spotlight effect.
The SVG filter primitive allows to fill a target rectangle with a repeated, tiled pattern of an input image.
The SVG filter generates noise which is helpful in simulating several natural phenomena
The element is used to define filters. To identify uniquely filter use id. The filters are defined in def elements.
The element of SVG includes elements from a different XML namespace.
The element is a container used to group other SVG elements.
The element is used to stroke an object.
The element includes images inside SVG documents.
The SVG element is used to draw line. The start point and endpoints are given to draw the line.
The element in SVG is used to define the graphics that is mostly used for the drawing purpose.
The element defines the transparency and visibility of the input object.
The is the sub element for the element that provides the ability to reference an external element as the definition of a motion path.
The element is used to define a path that starts from a position and ends to a particular position.
element is used to fill shapes with patterns made up of images.
The element of SVG is used to make any type of polygon on the SVG.
The element of SVG in HTML is used to create a shape by connecting lines through different points.
The element is used to create a rectangle.