Keyboard shortcuts

Press ← or → to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

SVG Animation

Demonstrates SVG animation capabilities:

  • CSS transforms on SVG elements (rotate, scale)
  • Fill/stroke color animation via @keyframes
  • stroke-dasharray/dashoffset line-drawing effect
  • Path morphing (d-attribute animation)
  • Hamburger Menus: 9 food-themed icons (morph, dash, pulse, orbit)

Tip: Some demos are best viewed in a full browser window. Click “Open in a new tab” below for the full experience.

Open in a new tab · View source on GitHub