The absolute staple for any modern interactive designer. Liquid Card Pro is a highly optimized, universally applicable WebGL hover state. It creates a pristine, water-like ripple distortion when the user interacts with the card, combined with a subtle RGB chromatic shift and an incredibly smooth 3D spatial tilt.

✨ Key Highlights

• Flawless SDF Rendering: Unlike standard CSS overflow: hidden which causes jagged edges on WebGL canvases, this component uses a custom Signed Distance Field (SDF) math function to render perfectly smooth, anti-aliased rounded corners directly in the shader.

• Tactile Water Ripple: A localized, expanding ripple distortion tracks the cursor seamlessly.

• Built-in Brightness: Correct the exposure of dark videos or images directly within the component properties without needing an external photo editor.

⚙️ Complete Design Control

• Core Physics: Simple, intuitive sliders for Liquid distortion intensity, RGB color shifting, and 3D card tilt.

• Media Mastery: Full video support with intelligent poster thumbnails, loop/mute toggles, and performance-saving hover-play logic.

💡 Perfect For: General portfolio grids, e-commerce product cards, and interactive blog post thumbnails.