Можно сдвинуть текст по вертикали, относительно базовой линии, с помощью SVG-атрибута baseline-shift
(для inline-записи) или одноимённого CSS-свойства (для назначения через стили и классы).
(Сведения о поддержке браузерами этого свойства везде разнятся.)
.sup { font-size: .7em; baseline-shift: super; }
.sub { font-size: .7em; baseline-shift: sub; }
<svg>
<text x="10" y="25" class="square">2376 м<tspan baseline-shift="super" font-size=".7em">2</tspan> (132×18)</text>
<text x="10" y="50">H<tspan baseline-shift="sub" font-size=".7em">2</tspan>O</text>
</svg>
<svg>
<text x="10" y="25" class="square">2376 м<tspan class="sup">2</tspan> (132×18)</text>
<text x="10" y="50">H<tspan class="sub">2</tspan>O</text>
</svg>
Также рекомендую использовать ×
(×) вместо различных х
.