This component combines real-time shader rendering with layered UI styling to create a high-end, tactile button experience. The animated chrome border produces fluid, iridescent reflections, while the inner glass surface adds depth and clarity.
Key Features
WebGL-powered liquid chrome shader animation
Smooth, organic motion with adjustable speed
Frosted glass inner button with depth and reflections
Circular design with customizable size and border thickness
Built-in hover and tap interactions (scale + spring physics)
Optional custom SVG icon support (auto-masked)
Fallback icon set included (Folder, Lightning, Cursor)
Link-enabled (acts as button or anchor)
Customization Options
Size (40–300px)
Border width
Animation speed
Glass opacity
Icon (default or custom SVG)
Click link
Use Cases
Hero CTAs
Portfolio interactions
Product highlights
Navigation buttons
Experimental / high-end UI sections