diff --git a/apps/site/app/(home)/page.tsx b/apps/site/app/(home)/page.tsx
index 30dc059b5..f2692af72 100644
--- a/apps/site/app/(home)/page.tsx
+++ b/apps/site/app/(home)/page.tsx
@@ -29,16 +29,18 @@ export default function HomePage() {
                   <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7l5 5m0 0l-5 5m5-5H6" />
                 </svg>
               </Link>
-              <Link
-                href="/playground"
+              <a
+                href="https://storybook.objectui.org"
+                target="_blank"
+                rel="noopener noreferrer"
                 className="inline-flex items-center justify-center rounded-lg border-2 border-fd-primary bg-fd-primary/10 px-8 py-3.5 text-base font-semibold text-fd-primary transition-all hover:bg-fd-primary/20"
               >
                 <svg className="mr-2 h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
-                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
                 </svg>
-                Try Playground
-              </Link>
+                View Storybook
+              </a>
               <a
                 href="https://github.com/objectstack-ai/objectui"
                 target="_blank"