diff --git a/apps/docs/app/layout.tsx b/apps/docs/app/layout.tsx
index 062f746608..b9d7fd72e7 100644
--- a/apps/docs/app/layout.tsx
+++ b/apps/docs/app/layout.tsx
@@ -5,6 +5,7 @@ import "@/styles/tailwind.css";
 import glob from "fast-glob";
 import { type Metadata } from "next";
 import { Jost } from "next/font/google";
+import Script from "next/script";
 
 export const metadata: Metadata = {
   title: {
@@ -27,6 +28,18 @@ const RootLayout = async ({ children }: { children: React.ReactNode }) => {
 
   return (
     <html lang="en" className="h-full" suppressHydrationWarning>
+      <head>
+        {process.env.NEXT_PUBLIC_LAYER_API_KEY && (
+          <Script
+            strategy="afterInteractive"
+            src="https://storage.googleapis.com/generic-assets/buildwithlayer-widget-4.js"
+            primary-color="#00C4B8"
+            api-key={process.env.NEXT_PUBLIC_LAYER_API_KEY}
+            walkthrough-enabled="false"
+            design-style="copilot"
+          />
+        )}
+      </head>
       <body className={`flex min-h-full bg-white antialiased dark:bg-zinc-900 ${jost.className}`}>
         <Providers>
           <div className="w-full">
diff --git a/turbo.json b/turbo.json
index 31dbec778a..0b55d310c0 100644
--- a/turbo.json
+++ b/turbo.json
@@ -108,6 +108,7 @@
         "INVITE_DISABLED",
         "IS_FORMBRICKS_CLOUD",
         "MAIL_FROM",
+        "NEXT_PUBLIC_LAYER_API_KEY",
         "NEXT_PUBLIC_DOCSEARCH_APP_ID",
         "NEXT_PUBLIC_DOCSEARCH_API_KEY",
         "NEXT_PUBLIC_DOCSEARCH_INDEX_NAME",
