Jump to content


Draw SVG Plugin Not Animating Path (First Time User of Plugin)

Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I was using the draw svg plugin and trying to animate the first path (the capital letter P, there are 7 paths, 6 letters and 1 circle around them). I was modeling my first attempt at this after this example, 

See the Pen bdrjjO by GreenSock (@GreenSock) on CodePen

, but something is off on mine and I can't figure out what it is.

See the Pen ZbpBjw by jstafford (@jstafford) on CodePen

Link to comment
Share on other sites

Thanks Diaco. I think the actual effect I was going for was making the letter look like it is being handwritten, not simply outlined with stroke. Are there ways of achieving this with the plugin?

Link to comment
Share on other sites

this is a nice solution. I could still use drawsvg on the stroke that fills the mask.

Link to comment
Share on other sites

you should to use open paths or use a text mask . 


pls check this out : 

See the Pen XmjNvr by MAW (@MAW) on CodePen

  • Like 4
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.