HTML <svg> viewbox Attribute

Example

<svg viewBox="0 0 100 150" xmlns="http://www.w3.org/2000/svg">
  <rect x="0" y="0" width="30" height="30" />
  <rect x="0" y="50" width="30" height="30" />
  <rect x="0" y="100" width="50%" height="30" />
</svg>

Try this code ❯

Meaning

The viewBox attribute defines the position and dimension, in user space, of an SVG viewport.

Standard Syntax

<svg viewbox="list-of-numbers">

Attribute Values

Value	Description
list-of-numbers (min-x, min-y, width and height)	The numbers, which are separated by whitespace and/or a comma, specify a rectangle in user space which is mapped to the bounds of the viewport established for the associated SVG element (not the browser viewport).