Orbit Menu

Circular navigation menu with orbiting items.

Loading...

Properties

100

Radius of the orbit

#ffffff

Color of the menu button

Installation

npm install @reactomega/ui framer-motion

Usage

Usage

import { OrbitMenu } from '@reactomega/ui';

export default function App() {
  const items = [
    { label: 'Home', onClick: () => console.log('Home') },
    { label: 'About', onClick: () => console.log('About') },
    { label: 'Contact', onClick: () => console.log('Contact') },
    { label: 'Blog', onClick: () => console.log('Blog') },
  ];

  return (
    <div className="flex items-center justify-center h-screen">
      <OrbitMenu items={items} radius={100} />
    </div>
  );
}