design-infraReport a problem or share feedback← Catalog
Fluid Glass
freereact-bits/fluid-glass
Glassmorphism container with animated liquid distortion refraction.
$
npx shadcn@latest add @react-bits/FluidGlass-TS-TWnpm deps: three, @react-three/fiber, @react-three/drei, maath
- Source
- React Bits
- Kind
- component
- Categories
- misc
- Use as
- drop-in — replaces your component
- Applies to
- misc
- Motion
- on scroll · expressive · webgl · high cost
- Tags
- components, three
- Licence
- MIT + Commons Clause: free to use in commercial apps/sites, but you may not sell or redistribute the components themselves (alone, bundled, or ported). React Bits Pro is a separate paid product.
- Live demo
- www.reactbits.dev
- Docs
- www.reactbits.dev
Similar
Compare all 4 →- Distorted Glasscult-ui/distorted-glassA glass morphism effect component using SVG filters with fractal noise to create visual transitions between sections
- Refine Framereact-bits/refine-frameReserved-aspect frame that walks any media through queued, generating, refining and complete without layout shift: each stage is one blur, saturate, scale and opacity tween, a soft band sweeps while it works, a chip reports the stage, and an error dims the picture behind a retry pill.
- Bottom Sheetbeui/bottom-sheetVaul-inspired draggable bottom sheet with snap points, inertia and glass surface.