Nexus floating dock

Bottom-centered macOS-style dock with pointer-driven magnification, neighbor scaling, glass pill chrome, tooltips, and a touch-friendly expandable mobile menu.

Navbarsspringhovernavigationmotiondockglasstooltip

Nexus floating dock

Playground

Shape the component before you copy it.

Adjust the important props for this component and grab JSX that matches your choices.

desktopClassName

Extra class names for desktop dock wrapper.

mobileClassName

Extra class names for mobile dock wrapper.

Generated JSX

Copy this into your page.

<FloatingDock
  desktopClassName=""
  mobileClassName=""
/>

Animation effects

springhover

Copy-paste ready

Use the Code tab above to inspect and copy this component into your project.

Full-page demo

Installation