Glassmorphism fails when transparency becomes the style of every container. Liquid Glass works when material, depth and motion explain the relationship between surfaces.
Give every depth a job
A thin glass control, a regular content card and a thick navigation drawer should not share the same opacity and blur. Their material depth should match their interaction role.
At Nahira we use one law—translucent fill, saturation, specular edge, inner border, refraction and environmental shadow—with different calibrated depths.
Contrast comes before atmosphere
Glass must remain readable over the actual background, not only over a design-system checkerboard. Light and dark themes need distinct surface hierarchies and tested text contrast.
When browser support or performance removes backdrop blur, the fallback should still look intentional and preserve hierarchy.
Motion should explain material
A glass surface can respond with a small shift in highlight, shadow or scale. Large floating motion, constant glow and spring on every card turn material into distraction.
Reduced-motion preferences should remove nonessential transitions without breaking the state change itself.
What to carry forward
- Use glass to explain layering and focus.
- Keep a solid visual ground beneath floating surfaces.
- Test contrast on real backgrounds in both themes.
- Provide performance, fallback and reduced-motion behavior.