SVG textLength Attribute
textLength forces SVG text to render at an exact specified width, adjusting character spacing to fit precisely within that constraint.
Drop your image here
Supports PNG, JPG, BMP, WEBP up to 5MB
Forcing Text to an Exact Width
Setting the textLength attribute on a <text> or <tspan> element specifies an exact target width for that text content, and the browser adjusts either character spacing or (combined with lengthAdjust="spacingAndGlyphs") individual glyph widths to make the text fit that exact length rather than rendering at its natural width.
- textLength specifies an exact target width for the text content
- Browser adjusts spacing (or glyph width, with lengthAdjust) to fit exactly
- Overrides the text's natural rendered width with a precisely controlled one
Practical Uses for Exact Text Width Control
textLength is useful for aligning a column of labels to consistent widths in a chart or diagram, fitting a dynamically generated label into a fixed-width badge or button shape without overflow, or ensuring localized text in different languages (which naturally varies in length) fits consistently within a fixed-width UI element.
- Aligns a column of chart or diagram labels to consistent widths
- Fits dynamically generated labels into fixed-width badges without overflow
- Helps localized text of varying natural length fit a fixed-width UI element
Frequently Asked Questions
What's the difference between textLength alone and combining it with lengthAdjust?
textLength alone typically adjusts only the spacing between characters to reach the target width, while adding lengthAdjust="spacingAndGlyphs" also scales the individual glyph shapes themselves, which can look distorted for large adjustments but fits more precisely.
Can textLength make text wider than its natural width, not just compress it?
Yes, textLength works in both directions — specifying a target width larger than the text's natural rendered width stretches it to fill that space, not only compressing overly long text.
Related guides
Ready to Convert Your Image to SVG?
Free online converter — no sign-up, no watermarks, results in under 3 seconds.
Try It Free — Convert Image to SVG