Back to the portfolio

Motion

Five techniques, running live

Not screenshots of animation work — each panel is the technique itself, executing in your browser right now.

  • CSS Keyframes

    CSS @keyframes

    Pure CSS animations with float, rotate, and glow effects

  • SVG Morphing

    SVG + CSS

    Shape morphing between circle and square

  • Canvas Particles

    HTML5 Canvas

    Interactive particle system responding to mouse movement

  • 3D Scene

    Three.js + React Three Fiber

    WebGL distorting sphere, mounted only once scrolled into view

  • GSAP ScrollTrigger

    GSAP ScrollTrigger

    Scroll-based animations with stagger and bounce effects