Hari Lamichhane

Flower menu

Buttons 118

About

Here is modern minimalistic flower menu component

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Flower menu to your project and fits it to your theme.

Code

How Flower menu is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

// This is a demo of a preview
import React from "react";
import { Component } from "@/components/ui/flower-menu";
import { Home, Settings, Mail, User } from "lucide-react";

const DemoOne = () => {
  const dummyMenuItems = [
    { icon: Home, href: "#home" },
    { icon: Settings, href: "#settings" },
    { icon: Mail, href: "#mail" },
    { icon: User, href: "#profile" },
  ];

  return (
    <div className="flex w-full h-screen justify-center items-center">
      <Component menuItems={dummyMenuItems} />
    </div>
  );
};

export default DemoOne;

Dependencies

More by Hari Lamichhane

View all
  • Reveal images

    Reveal images

    1.7K
  • Scheduler

    Scheduler

    90
  • Transaction List

    Transaction List

    76
  • Card Comment

    Card Comment

    21

More in Buttons

View all
  • Button

    Button

    5
  • Texture Button

    Texture Button

    97
  • Button Group

    Button Group

  • Eclipse Button

    Eclipse Button

    39
  • Button

    Button

    4
  • HeroUI Button Group

    HeroUI Button Group

  • Base Button

    Base Button

    4
  • App Store Button

    App Store Button

    458