Hype TextPath (text on path animation)

Extension Project
21

Great little snippet, Max! I’ve been playing around with this a bit. It’s no easy task if I’m wanting to use 2 different fonts and/or colors for a single line of text, is it? I’ve been racking my brain for a workaround…

22

Sorry for the delay, this extension simply transfers the innerHTML to the SVG. Therefore, you need to use tspan and the fill attribute (refer to SVG notation).

  1. Edit the inner HTML of the rectangle and write SVG syntax there, for example, Hello <tspan fill="green">World</tspan>.
  2. Done
1 Like
23

Thanks! I'm gonna try this out.