diff --git a/app/w/components/console/console.tsx b/app/w/components/console/console.tsx
new file mode 100644
index 0000000000..37244c6097
--- /dev/null
+++ b/app/w/components/console/console.tsx
@@ -0,0 +1,49 @@
+'use client'
+
+import { useState } from 'react'
+import { PanelLeftClose, PanelLeft, Terminal } from 'lucide-react'
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from '@/components/ui/tooltip'
+
+export function Console() {
+  const [isCollapsed, setIsCollapsed] = useState(false)
+
+  if (isCollapsed) {
+    return (
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <button
+            onClick={() => setIsCollapsed(false)}
+            className="fixed right-4 bottom-[18px] z-10 flex h-9 w-9 items-center justify-center rounded-lg bg-background text-muted-foreground transition-colors hover:text-foreground hover:bg-accent border"
+          >
+            <Terminal className="h-5 w-5" />
+            <span className="sr-only">Open Console</span>
+          </button>
+        </TooltipTrigger>
+        <TooltipContent side="left">Open Console</TooltipContent>
+      </Tooltip>
+    )
+  }
+
+  return (
+    <div className="fixed right-0 top-16 z-10 h-[calc(100vh-4rem)] overflow-y-auto w-72 border-l bg-background sm:block">
+      {/* Console content will go here */}
+
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <button
+            onClick={() => setIsCollapsed(true)}
+            className="absolute left-4 bottom-[18px] flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground hover:bg-accent"
+          >
+            <PanelLeftClose className="h-5 w-5" />
+            <span className="sr-only">Close Console</span>
+          </button>
+        </TooltipTrigger>
+        <TooltipContent side="right">Close Console</TooltipContent>
+      </Tooltip>
+    </div>
+  )
+}
diff --git a/app/w/layout.tsx b/app/w/layout.tsx
index a34988db85..9c8bce0548 100644
--- a/app/w/layout.tsx
+++ b/app/w/layout.tsx
@@ -2,6 +2,7 @@ import Providers from './providers'
 import { Toolbar } from './components/toolbar/toolbar'
 import { ControlBar } from './components/control-bar/control-bar'
 import { Sidebar } from './components/sidebar/sidebar'
+import { Console } from './components/console/console'
 
 export default function WorkspaceLayout({
   children,
@@ -18,6 +19,7 @@ export default function WorkspaceLayout({
           <ControlBar />
           <div className="h-16">
             <Toolbar />
+            <Console />
             <main className="grid items-start gap-2 bg-muted/40 h-[calc(100vh-4rem)]">
               {children}
             </main>