SVG Reference Manual

The SVG specification defines more elements and attributes.

Common SVG attributes:

  • id: Unique identifier of the element.
  • class: Class name of the element, used for CSS styling.
  • style: Inline style of the element.
  • transform: Transform applied to the element.
  • x, y: Position of the element.
  • width, height: Size of the element.
  • fill: Fill color.
  • stroke: Stroke color.
  • stroke-width: Stroke width.
  • opacity: Opacity.
  • visibility: Visibility of the element.

The SVG element list is as follows:

Element Description Attributes
<svg> Defines the root element of an SVG document width
height
viewBox
preserveAspectRatio
xmlns
...
<a> Defines a hyperlink xlink:href
target
...
<altGlyph> Defines an alternate glyph glyphRef
format
rotate
dx
dy
...
<altGlyphDef> Defines the<altGlyph>alternate glyph set of (None)
<altGlyphItem> Defines<altGlyphDef>the alternative glyph of glyphRef
format
...
<animate> Defines animation attributeName
from
to
dur
repeatCount
fill
...
<animateColor> Defines color animation attributeName
from
to
dur
repeatCount
fill
...
<animateMotion> Defines path animation path
dur
repeatCount
...
<animateTransform> Defines transform animation attributeName
type
from
to
dur
...
<circle> Defines a circle cx
cy
r
fill
stroke
stroke-width
...
<clipPath> Defines a clipping path clipPathUnits
(None)
<color-profile> Defines a color profile (None)
<cursor> Defines a mouse pointer x
y
width
height
xlink:href
...
<defs> Defines reusable elements (None)
<desc> Provides a description for SVG elements (None)
<discard> Specifies elements to be discarded (None)
<ellipse> Defines an ellipse cx
cy
rx
ry
fill
stroke
stroke-width
...
<feBlend> Defines image blending in
in2
mode
...
<feColorMatrix> Defines a color matrix in
type
values
...
<feComponentTransfer> Defines a transfer function for color/Alpha components (None)
<feComposite> Defines image compositing in
in2
operator
...
<feConvolveMatrix> Defines a convolution matrix in
order
kernelMatrix
...
<feDiffuseLighting> Defines diffuse lighting in
surfaceScale
diffuseConstant
...
<feDisplacementMap> Defines a displacement map in
in2
scale
...
<feDistantLight> Defines distant lighting azimuth
elevation
...
<feDropShadow> Defines a drop shadow dx
dy
stdDeviation
...
<feFlood> Defines colors for graphic elements flood-color
flood-opacity
...
<feFuncA> Defines a curve for adjusting the Alpha channel type
tableValues
slope
...
<feFuncB> Defines a curve for adjusting images type
tableValues
slope
...
<feFuncG> Defines a curve for adjusting images type
tableValues
slope
...
<feFuncR> Defines a curve for adjusting images type
tableValues
slope
...
<feGaussianBlur> Defines a Gaussian blur effect stdDeviation
...
<feImage> Defines an image to be embedded href
result
...
<feMerge> Defines a filter graphic for merging images (None)
<feMergeNode> Defines an input image for merging images (None)
<feMorphology> Defines a filter for changing the shape of an input image operator
radius
...
<feOffset> Defines the offset of an input image dx
dy
...
<fePointLight> Defines a point light source x
y
z
...
<feSpecularLighting> Defines a specular highlight effect in
surfaceScale
specularConstant
...
<feSpotLight> Defines a spotlight x
y
z
pointsAtX
pointsAtY
pointsAtZ
...
<feTile> Defines a repeated input image (None)
<feTurbulence> Defines a turbulent image baseFrequency
numOctaves
...
<filter> Defines a filter effect filterUnits
primitiveUnits
x
y
width
height
...
<font> Defines font resources horiz-origin-x
horiz-origin-y
horiz-adv-x
vert-origin-x
vert-origin-y
vert-adv-y
...
<font-face> Defines font properties font-family
font-style
font-variant
font-weight
font-stretch
...
<font-face-format> Defines a font file format (None)
<font-face-name> Defines a font name (None)
<font-face-src> Defines the location of a font file (None)
<font-face-uri> Defines the location of a font file (None)
<foreignObject> Defines other XML namespaces in SVG files
Other extensions