writing-mode

The writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom. The writing-mode attribute applies only to <text> elements; the attribute is ignored for <tspan>, <tref>, <altGlyph> and <textPath> sub-elements. (Note that the inline-progression-direction can change within a <text> element due to the Unicode bidirectional algorithm and properties direction and unicode-bidi.)

Note: As a presentation attribute, writing-mode can be used as a CSS property. See the CSS writing-mode property for more information.

You can use this attribute with the following SVG elements:

Usage notes

Default value horizontal-tb
Value horizontal-tb | vertical-rl | vertical-lr
Animatable Yes
horizontal-tb

This value defines a top-to-bottom block flow direction. Both the writing mode and the typographic mode are horizontal.

vertical-rl

This value defines a right-to-left block flow direction. Both the writing mode and the typographic mode are vertical.

vertical-lr

This value defines a left-to-right block flow direction. Both the writing mode and the typographic mode are vertical.

Specifications

Specification Status Comment
CSS Writing Modes Module Level 3
The definition of 'writing-mode' in that specification.
Proposed Recommendation Definition in CSS Writing Modes 3
Scalable Vector Graphics (SVG) 2
The definition of 'writing-mode' in that specification.
Candidate Recommendation Mainly refers to the definition in CSS Writing Modes 3 and defines a mapping between the deprecated SVG 1.1 values and the new values.
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'writing-mode' in that specification.
Recommendation Initial definition

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
writing-mode
?
?
?
?
?
?
?
?
?
?
?
?

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/writing-mode