Elevate Your Web
Animations Transitions Interactions
Effortlessly

<!-- Card element mouse move -->
<div id="card" data-tor="
  mouse(x):tiltY(20deg <2s>)
  focus(#input):s(.95 <2s, elastic>)
">...<div>

<!-- Input pop-out on focus -->
<input id="input" data-tor="
  focus:[tz(2rem) s(1.05) br(0.5rem) o(1) <2s, elastic>]
"/>

<!-- Button animation loop and hover effect -->
<button id="button" data-tor="
  animate:ty(0.25rem <1s, alternate, infinite>)
  hover:s(1.15 <1s, elastic>)
">...</button>

<!-- Card background image blur -->
<img id="bg" data-tor="
  focus(#input):[s(1.2) filter(blur(1rem) <2s, elastic>)]
"/>