Hi,
I’m trying to use the liquid-glass-react library for my navbar, but the different layers of the effect are overlapping instead of behaving like a liquid glass. I’ve tried adjusting cornerRadius, elasticity, and removing Tailwind styles, but the issue persists.
I’ve attached two screenshots:
1. Code screenshot – shows my current Navbar.jsx setup.
2. Result screenshot – shows how it looks in Chrome.
Any guidance on how to correctly structure the components or fix the layering would be greatly appreciated!
Thanks in advance.

Hi,
I’m trying to use the liquid-glass-react library for my navbar, but the different layers of the effect are overlapping instead of behaving like a liquid glass. I’ve tried adjusting cornerRadius, elasticity, and removing Tailwind styles, but the issue persists.
I’ve attached two screenshots:
1. Code screenshot – shows my current Navbar.jsx setup.
2. Result screenshot – shows how it looks in Chrome.
Any guidance on how to correctly structure the components or fix the layering would be greatly appreciated!
Thanks in advance.