About
An accessible dropdown menu built on Base UI with support for items, links, checkboxes, radio groups, submenus, separators and keyboard shortcuts.
Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Menu to your project and fits it to your theme.
Code
How Menu is used: the demo's code. The component's own source comes with a free account.
Usage.tsx
import Link from "next/link";
import { Button } from "@/components/ui/button";
import { Menu, MenuItem, MenuPopup, MenuTrigger } from "@/components/ui/menu";
export default function Particle() {
return (
<Menu>
<MenuTrigger render={<Button variant="outline" />}>Open menu</MenuTrigger>
<MenuPopup>
<MenuItem render={<Link href="/docs" />}>Docs</MenuItem>
<MenuItem render={<Link href="/particles" />}>Particles</MenuItem>
</MenuPopup>
</Menu>
);
}
















