Glass Menu Card is a high-end interactive component designed for modern UI and portfolio experiences. It combines a WebGL-powered “glass strip” refraction shader with smooth hover animations to create a visually striking image card that responds to user interaction in real time.
As users move their cursor across the card, subtle distortion waves and chromatic shifts bring the image to life, while an overlay menu fades in with staggered motion for a refined, editorial feel. A custom in-card cursor enhances immersion and elevates the interaction beyond standard hover effects.
Built for performance and flexibility, the component includes adjustable controls for refraction strength, chromatic aberration, animation easing, and layout customization—making it ideal for fashion, product showcases, creative portfolios, and premium landing pages.
Key Features:
WebGL-powered glass refraction hover effect
Smooth animated menu overlay with staggered transitions
Custom interactive cursor inside the component
Fully customizable controls (columns, radius, chroma, easing, etc.)
Responsive image support with graceful fallback
Optimized rendering with adaptive animation lifecycle
Perfect for designers and developers who want to add depth, motion, and a premium feel to their interfaces.
Pixels
