SkillGitHub
All components
fluid-glass-surface

Fluid glass surface

Creates a refractive glass surface for focused controls or media while preserving legibility.

  • Keyboard ready
  • Reduced motion
  • TypeScript
Scene
spatial · dark
Runtime cost
Medium
Motion engine
motion + css
Installnpx shadcn@latest add https://motion-lexicon.pages.dev/r/fluid-glass-surface.json

Component behavior

Highlight and refraction follow focus while content stays clear Creates a refractive glass surface for focused controls or media while preserving legibility.

Suitable events

Use for brand presentation, spatial exploration, and information-rich visual storytelling.

Runtime information

Motion engine
motion, css
Runtime cost
Medium
Dependencies
motion
Open public Registry JSON