SVG animation sits at a crossroads between two paradigms. SMIL (Synchronized Multimedia Integration Language) lets you declare animations directly in SVG markup — no CSS or JS required. CSS animations offer the same keyframe model you already know, applied to SVG attributes. Each has strengths the other lacks.

When to Use Which

SMIL shines for animating SVG-specific attributes like d (path morphing), viewBox, and stroke-dashoffset along a motion path. CSS is better for transforms, opacity, and color transitions — the same properties it handles well in HTML. For complex orchestration, reach for the Web Animations API.