The root element of an SVG document.

DOM object: SVGSVGElement
SVG2 spec: https://www.w3.org/TR/SVG2/struct.html#SVGElement

The <svg> element is the container for everything drawn in SVG. It is usually the root of a standalone .svg file or the outermost SVG tag inside an HTML document, but it can also be nested inside another <svg> to create an embedded sub-viewport with its own coordinate system. Every drawable element — shapes, groups, text, images — must live inside an <svg>.

A <svg> has two related but distinct sizes. The width and height attributes set its size on the page (the rectangle it occupies in the parent layout, measured in CSS pixels). The optional viewBox attribute sets its internal coordinate system: a rectangle in "user units" that gets mapped onto that on-page rectangle. By separating the two, you can author graphics in a convenient coordinate system (say, 0 0 1000 1000) and have them scale cleanly to any display size, with preserveAspectRatio controlling how the content is fit when the aspect ratios differ.

It can contain any number of child elements, such as Elements: Basic Shapes, Elements: Painting, Elements: Text, Elements: Filters, and Elements: Structural.

<svg width="300" height="200" viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" fill="crimson" />
</svg>

The width and height attributes define the size of the SVG on the page, while viewBox defines the user coordinate system that child elements are drawn in. The diagram below shows a <svg width="280" height="180" viewBox="0 0 100 100"> where the user-coordinate viewBox (the 0,0 to 100,100 square) is stretched to fill the outer canvas.

Attribute	Default	Description
x	0	Top-left X coordinate of the SVG viewport.
y	0	Top-left Y coordinate of the SVG viewport.
width	0	Width of the SVG viewport.
height	0	Height of the SVG viewport.
viewBox	(none)	Rectangle in userspace that the SVG viewport is mapped to.
preserveAspectRatio	xMidYMid meet	How to scale the SVG viewport to fit the SVG content.
transform	(none)	Transformation matrix to apply to SVG content.