This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
The markerHeight attribute represents the height of the viewport into which the <marker> is to be fitted when it is rendered according to the viewBox and preserveAspectRatio attributes.
You can use this attribute with the following SVG elements:
| Value | <length-percentage> | <number> |
|---|---|
| Default value | 3 |
| Animatable | Yes |
<length-percentage>This value defines either an absolute or a relative height of the marker. Relative values refer to the height specified via the viewBox and preserveAspectRatio attributes.
<number>This value defines the height of the marker in the units defined by the markerUnits attribute.
A value of zero disables rendering of the element and negative values are an error.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
markerHeight |
1 | 12 | 1.5 | 15 | 3 | 18 | 4 | 14 | 2 | 1.0 | 4.4 | 2 |
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/markerHeight