diff --git a/web/components/hero2.tsx b/web/components/hero2.tsx
new file mode 100644
index 0000000..fd98e32
--- /dev/null
+++ b/web/components/hero2.tsx
@@ -0,0 +1,43 @@
+"use client"
+
+import { Button } from "@/components/ui/button"
+import { ArrowRight } from "lucide-react"
+import Link from "next/link"
+import Image from "next/image"
+
+export default function Hero() {
+  return (
+    <section className="py-20 px-4 sm:px-6 lg:px-8">
+      <div className="flex items-center justify-center mb-8">
+        <div className="flex items-center">
+          <Image
+            src="https://raw.githubusercontent.com/MacRimi/ProxMenux/main/images/logo.png"
+            alt="ProxMenux Logo"
+            width={200}
+            height={200}
+            className="mr-6"
+          />
+          <div className="w-px h-20 bg-white mx-6"></div>
+          <div className="text-left">
+            <h1 className="text-4xl sm:text-5xl md:text-6xl font-extrabold text-white">ProxMenux</h1>
+            <p className="text-2xl sm:text-3xl md:text-4xl mt-2 bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-purple-500 font-bold">
+              An Interactive Menu for Proxmox VE Management
+            </p>
+          </div>
+        </div>
+      </div>
+      <p className="text-base sm:text-lg md:text-xl mb-8 max-w-4xl mx-auto text-gray-300 text-center">
+        ProxMenux is a management tool for Proxmox VE that simplifies system administration through an interactive menu,
+        allowing you to execute commands and scripts with ease.
+      </p>
+      <div className="flex justify-center">
+        <Button size="lg" className="bg-blue-500 hover:bg-blue-600" asChild>
+          <Link href="/docs/installation">
+            Install Now
+            <ArrowRight className="ml-2 h-4 w-4" />
+          </Link>
+        </Button>
+      </div>
+    </section>
+  )
+}
\ No newline at end of file