Animated Wave Footer

Interactive hover effects BG

Animated Wave is a customizable motion component for Framer that transforms a stack of horizontal bars into a fluid, continuously moving wave. Choose from six carefully tuned presets or switch to Custom mode to control the wave physics, shape, speed, amplitude, frequency, direction, phase, spacing, colors, and interaction. Designed to be lightweight, responsive, and easy to customize directly from Framer's property panel. Features 🎛 Preset System Classic Soft Energetic Deep Minimal Pulse Custom 〰 Custom Wave Motion Bar Count Amplitude Frequency Speed Wave Shape Forward / Reverse direction Phase offset 〰 Multiple Wave Shapes Sine Soft Triangle Square 🎨 Flexible Styling Solid color mode Two-color gradient mode Custom background color Wave width Bar spacing Corner radius Edge fading 🖱 Interactive Motion Enable hover interaction to dynamically boost the wave's amplitude and create a more responsive feel. ⚡ Performance Optimized RequestAnimationFrame animation Viewport-aware animation Static-renderer support Automatic animation cleanup GPU-friendly transforms No external dependencies ♿ Accessibility Add an optional ARIA label when the wave communicates meaningful information, or leave it empty when the animation is purely decorative. Support Need help customizing Animated Wave or using it in your Framer project? I'm happy to help with setup, customization, or troubleshooting. X: @karimsaif0 Email: karimsaif010@gmail.com

Interactive hover effects BG