The SVG format is not only useful for the display of vector based shapes. You can also place and edit font in it. In contrast to semantic font labelling in HTML, there are some particular things you need to keep in mind. You should also know some differences to the markup via CSS. Marking Fonts Via SVG and Editing With CSS While HTML knows several semantic elements that allow you to mark text as a headline, paragraph, list or grid, the SVG format only knows the ,,<text>" element. You can place and edit font within it. <text>Lorem ipsum.</text> The design of the text is done just like it is in HTML using CSS. You can integrate web fonts and define the font type, font size, and orientation. While the font and its size are specified with the known properties ,,font-family" and ,,font-size", there is the property ,,text-anchor" for the orientation. It knows the values ,,start" for left-aligned, ,,end" for right-aligned and ,,middle" for centered text. text { font-family: "Source Sans"; font-size: 30px; text-anchor: middle; } As SVG doesn’t know the classic multiline text, setting line spacing is unnecessary. Like every other SVG element, the ,,<text>" element is placed using ,,x" […]* You might also be interested in the following articlesSurviving the Zombie Apocalypse with HTML5 and SVG #2: Text, Paths andLining.js: Controlling Text Lines per CSS SelectorCSS3: InDesign-Like Text Formatting with Exclusions and RegionsSurviving the Zombie Apocalypse with HTML5 and SVGCSS3: Viewport Units – New Units for Responsive DesignsBetter than Pure CSS3: Realistic and Complex Shadows with Shine.js