Floating Navigation
A sleek, floating navigation bar with fluid hover effects and animated icons.
Installation
pnpm dlx rareui add floating-navigation
Usage
1
Import the component
import FloatingNavigation from "@/components/rareui/FloatingNavigation";
2
Use in your application
export default function MyComponent() {
return (
<FloatingNavigation />
);
}
Features
Elegant floating bar that stays accessible without cluttering the screen.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | NavItem[] | defaultItems | Array of navigation items with id, label, and icon. |
className | string | - | Additional styles for the container. |