Velocity UI
Loading…
Menu

Floating Dock

A floating dock component with magnification effect, inspired by macOS.

Preview

Live interactive preview.

Installation

Add this component to your project using the CLI:

terminal
npx -y vui-registry-cli-v1@latest add floating-dock

Dependencies

  • framer-motion: latest
  • lucide-react: latest

Props

Component property reference.

NameTypeDefaultDescription
items{ title: string; icon: React.ReactNode; href: string }[]-Array of items to display in the dock.
desktopClassNamestring-Additional CSS classes for desktop view.
mobileClassNamestring-Additional CSS classes for mobile view.
Context Worth Keeping In Orbit

Most components here are inspired by outstanding libraries and creators in the ecosystem. I don’t claim to be the original author — this is my space for learning, rebuilding, and understanding great work at a deeper level.

I’m still a student of the craft, constantly studying the best and translating what I learn through my own perspective. Every piece reflects curiosity, respect for the community, and small creative touches that feel true to me.

I’ve done my best to credit inspirations properly. If anything is missing or inaccurate, I truly appreciate a message so it can be corrected with care.