About Fish Eye Accordion
A dynamic FAQ accordion inspired by the fisheye magnification effect.
Fisheye FAQ transforms a traditional accordion into an interactive, cursor-responsive experience. As the pointer moves across the list, nearby questions smoothly magnify based on their distance from the cursor. Hovering a question can automatically open its answer, creating a fluid and tactile FAQ interaction.
Built for modern Framer websites that want more personality than a standard accordion.
Preview
Great For
SaaS and startup websites
Product landing pages
Agency and studio websites
Portfolio websites
Interactive documentation
Product FAQs
Pricing and feature sections
Experimental and motion-focused websites
Minimal editorial layouts
Modern Framer templates
Features
🐟 Cursor-driven fisheye magnification
✨ Smooth spring-based interactions
🖱 Hover or click activation
📱 Touch and pen-friendly interaction
🔄 Animated answer expansion
➕ Customizable expand/collapse icon
🎯 Adjustable fisheye range and scale
🪄 Optional hover lift
🔍 Optional reveal blur
🎨 Fully customizable colors and borders
🔤 Framer Font controls
📐 Adjustable spacing, padding, radius, and width
⚡ Configurable spring stiffness, damping, and mass
🎬 Custom opening and closing animation
♿ Reduced-motion support
⌨ Keyboard support with Enter and Space
Customize
Make the interaction match your design system directly from the Framer property panel.
Customize the FAQ content, typography, colors, borders, shadows, spacing, corner radius, icon, fisheye intensity, cursor range, spring physics, hover movement, active scale, reveal blur, opening and closing animations, activation mode, reduced motion, and keyboard behavior.
No code changes are required for the standard customization.
Support
Need help customizing Fisheye FAQ or integrating it into your Framer project?
X: @karimsaif0
Email: karimsaif010@gmail.com
