<svg viewBox="0 0 500 60">
<text y="20">I've got no kerning</text>
<text y="40" kerning="4">I've got kerning: 4;</text>
</svg>
<svg viewBox="0 0 500 60">
<text y="20">I've got no letter-spacing</text>
<text y="40" letter-spacing="2">I've got letter-spacing: 2;</text>
</svg>
<svg viewBox="0 0 500 60">
<text y="20">I've got no word-spacing</text>
<text y="40" word-spacing="5">I've got word-spacing: 5;</text>
</svg>
<svg viewBox="0 0 500 60">
<text y="20" textLength="500" lengthAdjust="spacing">
I've got textLength of 500 with lengthAdjust="spacing"
</text>
<text y="40" textLength="500" lengthAdjust="spacingAndGlyphs">
I've got textLength of 500 with lengthAdjust="spacingAndGlyphs"
</text>
</svg>
body {
padding: 20px;
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.