LottieFiles
Hover Bot
0:000:00
상태 머신
  • 최적화된 dotLottie추천

    테마, 스테이트 머신 및 인터랙티브 기능을 지원하는 가장 작은 파일 크기입니다.

    Lottie JSON보다 85% 더 작음
    21.4 KB
  • dotLottie

    테마와 스테이트 머신을 지원하는 압축된 Lottie 애니메이션입니다.

    24.4 KB
  • 최적화된 Lottie JSON

    표준 Lottie 지원과 함께 더 빠른 로딩을 위해 최적화된 JSON 형식입니다.

    Lottie JSON보다 15% 더 작음
    125.4 KB
  • Lottie JSON

    다양한 도구 및 플랫폼에서 폭넓은 호환성을 제공하는 표준 Lottie 애니메이션 형식입니다.

    147.1 KB
  • 애니메이션 SVG신규

    메시징 및 소셜 게시물에 공유하기 쉬운 애니메이션 형식입니다.

  • GIF

    빠른 공유와 간단한 미리보기에 이상적인 단순 반복 비디오입니다.

  • MP4

    프레젠테이션, 소셜 미디어 및 마케팅 콘텐츠를 위한 고품질 비디오 형식입니다.

  • WebM

    빠른 로딩과 더 작은 파일 크기에 최적화된 최신 웹 비디오 형식입니다.

  • MOV

    편집 및 합성을 위해 투명도를 지원하는 고품질 비디오 형식입니다.

상호작용 및 플러그인

모두 보기
figma
after-effects
framer
canva
webflow
wix

Lottie 간단 라이선스 하에 무료 사용 가능

무료 Hover Bot 애니메이션

Week 2 of my State Machine Self-Challenge is here. I built a hover robot that reacts as you type your name 🤖💬 The idea was to use it on a sign-up page so as you type, the robot responds to what you’re doing in real time. Its eyes follow your pointer like it’s curious who you are, and it switches between typing, error, or success states depending on your input. Our team is working on proper pointer controls soon 👀 but for now, this is a fun little hack for tracking to make animations feel alive. If you stop typing for too long, an idle timer kicks in. Think of it like a tiny traffic light 🟢🟡🔴 that changes colors and shows random messages the longer you stay idle. Source code with the animation in action https://codepen.io/Yaamin-Mohamed/pen/QwypqNR

Week 2 of my State Machine Self-Challenge is here. I built a hover robot that reacts as you type your name 🤖💬 The idea was to use it on a sign-up page so as you type, the robot responds to what you’re doing in real time. Its eyes follow your pointer like it’s curious who you are, and it switches between typing, error, or success states depending on your input. Our team is working on proper pointer controls soon 👀 but for now, this is a fun little hack for tracking to make animations feel alive. If you stop typing for too long, an idle timer kicks in. Think of it like a tiny traffic light 🟢🟡🔴 that changes colors and shows random messages the longer you stay idle. Source code with the animation in action https://codepen.io/Yaamin-Mohamed/pen/QwypqNR