Skip to main content

Hi everyone,


I am trying to create a SVG path animation using anime.js, i have converted this image


to a svg and exported.(currently not able to post the full image as my account is new)


when i animate the first letter ie “S” using the JS - get this image…



As you can see the “S” is clipped at left, top and right, why is this happening -



  1. I have tred rounding to pixel,

  2. and setting the pixel grid

The path probably has a center stroke. I see the path is getting clipped in half at those points. Enable frame outlines in Figma and you’ll see the path getting clipped there as well. Either make the S a little smaller or make the frame a little larger so that it fits within the bounds.