diff --git a/components/app/chrome/site-footer.tsx b/components/app/chrome/site-footer.tsx
index ca64342..16e60b2 100644
--- a/components/app/chrome/site-footer.tsx
+++ b/components/app/chrome/site-footer.tsx
@@ -117,6 +117,16 @@ export function SiteFooter() {
               Links
             </p>
             <ul className="space-y-2.5">
+              <li>
+                <Link
+                  href="https://pro.beui.dev"
+                  target="_blank"
+                  rel="noreferrer noopener"
+                  className="text-sm font-medium text-accent transition-colors hover:text-accent/80"
+                >
+                  beUI Pro
+                </Link>
+              </li>
               <li>
                 <Link
                   href="/components/motion"
diff --git a/components/app/chrome/site-header.tsx b/components/app/chrome/site-header.tsx
index 220145e..83744ee 100644
--- a/components/app/chrome/site-header.tsx
+++ b/components/app/chrome/site-header.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { Star, SwatchBook } from "lucide-react";
+import { ArrowUpRight, Star, SwatchBook } from "lucide-react";
 import { useMotionValueEvent, useScroll } from "motion/react";
 import Image from "next/image";
 import Link from "next/link";
@@ -118,17 +118,35 @@ export function SiteHeader({
             >
               Sponsors
             </Link>
+            <a
+              href="https://pro.beui.dev"
+              target="_blank"
+              rel="noreferrer noopener"
+              className="inline-flex items-center gap-1 rounded-md px-3 py-1.5 text-sm font-medium text-accent transition-colors hover:text-accent/80"
+            >
+              Pro
+              <ArrowUpRight className="h-3.5 w-3.5" />
+            </a>
           </nav>
         </div>
 
         <nav className="flex items-center gap-2">
           <SiteSearch className="w-9 justify-center px-0 sm:w-44 sm:justify-start sm:px-3 lg:w-56" />
+          <a
+            href="https://pro.beui.dev"
+            target="_blank"
+            rel="noreferrer noopener"
+            className="inline-flex items-center gap-1 rounded-2xl border border-border bg-card/20 px-3 py-2 text-xs font-medium text-accent transition-colors hover:border-(--color-border-strong) md:hidden"
+          >
+            Pro
+            <ArrowUpRight className="h-3.5 w-3.5" />
+          </a>
           <Tooltip content="Customize" side="bottom">
             <button
               type="button"
               onClick={() => setPanelOpen(true)}
               aria-label="Customize theme"
-              className="flex h-9 w-9 items-center justify-center rounded-2xl border border-border bg-card/20 text-muted-foreground transition-colors hover:text-foreground"
+              className="hidden h-9 w-9 items-center justify-center rounded-2xl border border-border bg-card/20 text-muted-foreground transition-colors hover:text-foreground sm:flex"
             >
               <SwatchBook className="h-4 w-4" />
             </button>
diff --git a/components/app/landing/hero.tsx b/components/app/landing/hero.tsx
index b2fefde..2c742a3 100644
--- a/components/app/landing/hero.tsx
+++ b/components/app/landing/hero.tsx
@@ -3,7 +3,6 @@
 import { motion } from "motion/react";
 import { ArrowRight, ArrowUpRight } from "lucide-react";
 import { EASE_OUT } from "@/lib/ease";
-import { GithubIcon } from "@/components/app/icons";
 import { PressLink } from "@/components/app/press-link";
 import { TextReveal } from "@/components/motion/text-reveal";
 import { INSTALLABLE_COUNT } from "@/lib/registry";
@@ -70,13 +69,13 @@ export function Hero() {
           <ArrowRight className="h-4 w-4 transition-transform group-hover:translate-x-0.5" />
         </PressLink>
         <PressLink
-          href="https://github.com/starc007/ui-components"
+          href="https://pro.beui.dev"
           target="_blank"
           rel="noreferrer noopener"
-          className="inline-flex h-10 items-center gap-2 rounded-full border border-border bg-card px-4 text-sm font-medium text-foreground hover:border-(--color-border-strong) focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent"
+          className="group inline-flex h-10 items-center gap-2 rounded-full border border-accent/40 bg-accent/10 px-4 text-sm font-medium text-accent hover:border-accent/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent"
         >
-          <GithubIcon className="h-4 w-4" />
-          GitHub
+          Explore Pro
+          <ArrowUpRight className="h-4 w-4 transition-transform group-hover:translate-x-0.5 group-hover:-translate-y-0.5" />
         </PressLink>
       </motion.div>
     </div>