SVG Path Drawing Animation

Wave Path

Signature Style

Geometric Logo

Letter Drawing

// Get the total length of the path
const path = document.querySelector('.logo-path');
const length = path.getTotalLength();

// Set up the starting state
gsap.set(path, {
  strokeDasharray: length,
  strokeDashoffset: length
});

// Animate the drawing
gsap.to(path, {
  strokeDashoffset: 0,
  duration: 2,
  ease: 'power2.inOut'
});