Spider Hunt

A living spiderweb that turns your cursor into prey.

Spider Hunt is an interactive Framer Code Component featuring a geometric spiderweb and an animated eight-legged spider that tracks your cursor, crawls toward it, catches its prey, and performs a playful eating animation.

With delicate web strands, organic movement, and a vibrant pink cursor, Spider Hunt transforms a simple background into a memorable interactive experience.

✨ Great For

• Creative portfolios and personal websites

• Interactive landing pages and hero sections

• Experimental web experiences

• Halloween and spooky-themed projects

• Digital art and playful storytelling

• Websites that need a unique microinteraction

👀 Preview: https://spiderhunt.framer.website/

⚡ Features

• Interactive Spider: Eight-legged animated spider with articulated leg movement.

• Cursor Tracking: Smooth pursuit that follows your pointer.

• Catch & Eat: Multi-stage hunting, catching, eating, and recovery animations.

• Procedural Spiderweb: Responsive radial strands and polygonal web rings.

• Custom Prey Cursor: Bright pink cursor with adjustable glow and optional trail.

• Organic Movement: Body rotation, crawling motion, and subtle idle animation.

• Responsive Design: Adapts to different component sizes.

• Performance-Aware: Visibility-based animation pausing and cleanup.

• Accessibility: Reduced-motion support and static rendering.

• No External Assets: Built with React, TypeScript, and SVG.

🎛️ Customize

Make Spider Hunt fit your creative direction with adjustable controls:

• Web: Background color, strand colors, opacity, density, scale, and thickness.

• Spider: Size, color, movement speed, follow strength, leg animation, and body rotation.

💛 Support

Created by @Karim Saif

Questions, feedback, or suggestions? Feel free to reach out.

X / Twitter: @karimsaif0

Email: karimsaif010@gmail.com