About Apple Bite
A playful interactive cursor that turns every click into a satisfying crunch. The apple follows your pointer with smooth spring physics, then takes a procedural bite on every click.
Features
Apple cursor that follows your pointer with spring physics
Procedural bite holes with rim shadows and exposed flesh
Crumb particles, shockwave rings, and rising aroma wisps
Apple shakes on impact and breathes gently while idle
Auto-reform after a delay, or persist mode to keep bites
Optional system cursor hide for a fully custom experience
Marketplace-safe: static fallback, viewport pause, tab pause
What you can customise
Colors are exposed flat at the top so you can bind each one to a Framer Color Style for instant theming:
Skin Color - the apple's outer gradient
Flesh Color - the inside of each bite
Stem Color - the stem gradient
Leaf Color - the leaf gradient
Grouped controls:
Apple - size, skin, stem, leaf, and flesh colors
Physics - spring stiffness and damping for follow feel
Effects - toggle crumbs, shockwave, aroma, and shake
Behavior - auto or persist mode, reset delay, max bites
Cursor - hide system cursor and z-index layering
Stage - background color for the static preview
How to use
Drop the component onto your canvas. It renders as a centered apple for the static preview.
Preview the site to see the cursor follow your pointer.
Click anywhere to take a bite. Keep clicking until the core appears.
Adjust colors, physics, and effects to match your brand.
Tips
Pair a dark background with bright skin and flesh colors for a dramatic look.
Increase stiffness for a tighter follow, or lower damping for more glide.
Hide the system cursor to create a fully immersive custom pointer experience.
Refund Policy: All sales are final. No refunds.
Free email support: framer@muhmad.me
More Components: sbarah.com
Thanks 🎉🌵
