Tell, how is this animation created? SVG? How can I do the same via webflow?
Yes, looks like SVG. I see how everything except the blue lines can be made. They are the hardest part here.
Too. I understand everything except the lines
I’m trying something > https://infographic-line-grow.webflow.io/
Hm I think if I use width for the blue growing BG instead of height the effect will be better How stupid I am
Not even close
An SVG animation is pretty intimidating at start, but one you understand it, it is quiet simple.
Basically- you need to create an SVG and embed it as a code instead of uploading it as an image. Then you can manipulate the code with CSS.
Here’s a Codepen with an example.
Absolutely, but if someone wants an easy way I think my lame approach will help
I’m using SVG with transparent path and some masking and a blue background div for the growing effect.
I need to play more with actual SVG animations.
maybe this weill help you-
Thanks for sharing! Playing with SVG animations looks fun