javascript - Is there a way to curve / arc text using CSS3 / Canvas -


I'm trying to create a curved text effect using CSS3, HTML canvas or SVG Am (see the picture below for example)? Is this possible? If so, how can I achieve this effect?

Update: To clarify: The text that will be dynamic will be dynamic.

arcu or curved text example

< Div class = "post-text" itemprop = "text">

SVG supports a path on the text, though it does not 'turn' the individual glyph along the path. Here's how you make it:

  ... & lt; Defs & gt; & Lt; Path id = "text path" D = "M1050C1090 90 90 50" /> & Lt; / Defs & gt; & Lt; Text fill = "red" & gt; & Lt; TextPath xlink: href = "# text path" & gt; Text on the path & lt; / TextPath & gt; & Lt; / Text & gt; ...  

Comments