diff --git a/src/interface/web/app/automations/page.tsx b/src/interface/web/app/automations/page.tsx
index fa88958b..f7fbb906 100644
--- a/src/interface/web/app/automations/page.tsx
+++ b/src/interface/web/app/automations/page.tsx
@@ -395,13 +395,13 @@ function AutomationsCard(props: AutomationsCardProps) {
             </CardContent>
             <CardFooter className="flex flex-col items-start md:flex-row md:justify-between md:items-center gap-2">
                 <div className="flex gap-2">
-                    <div className="flex items-center bg-blue-50 rounded-lg p-1.5 border-blue-200 border dark:bg-blue-800 dark:border-blue-500">
+                    <div className="flex items-center rounded-lg p-1.5 border-blue-200 border dark:border-blue-500">
                         <CalendarCheck className="h-4 w-4 mr-2 text-blue-700 dark:text-blue-300" />
                         <div className="text-s text-blue-700 dark:text-blue-300">
                             {timeRecurrence}
                         </div>
                     </div>
-                    <div className="flex items-center bg-purple-50 rounded-lg p-1.5 border-purple-200 border dark:bg-purple-800 dark:border-purple-500">
+                    <div className="flex items-center rounded-lg p-1.5 border-purple-200 border dark:border-purple-500">
                         <ClockAfternoon className="h-4 w-4 mr-2 text-purple-700 dark:text-purple-300" />
                         <div className="text-s text-purple-700 dark:text-purple-300">
                             {intervalString}
diff --git a/src/interface/web/app/page.module.css b/src/interface/web/app/page.module.css
index b2696e4a..faca97c7 100644
--- a/src/interface/web/app/page.module.css
+++ b/src/interface/web/app/page.module.css
@@ -1,5 +1,5 @@
 div.main {
-    height: 100dvh;
+    height: 100%;
     color: hsla(var(--foreground));
     margin-left: auto;
     margin-right: auto;
diff --git a/src/interface/web/app/page.tsx b/src/interface/web/app/page.tsx
index a678c2f8..4571fb87 100644
--- a/src/interface/web/app/page.tsx
+++ b/src/interface/web/app/page.tsx
@@ -34,8 +34,10 @@ import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { AgentCard } from "@/app/components/agentCard/agentCard";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
 import LoginPopup from "./components/loginPrompt/loginPopup";
-import { SidebarProvider, SidebarTrigger } from "@/components/ui/sidebar";
+import { SidebarInset, SidebarProvider, SidebarTrigger } from "@/components/ui/sidebar";
 import { AppSidebar } from "./components/appSidebar/appSidebar";
+import { Separator } from "@/components/ui/separator";
+import { KhojLogoType } from "./components/logo/khojLogo";
 
 interface ChatBodyDataProps {
     chatOptionsData: ChatOptions | null;
@@ -461,23 +463,33 @@ export default function Home() {
     return (
         <SidebarProvider>
             <AppSidebar conversationId={conversationId} />
-            <SidebarTrigger />
-            <div className={`${styles.main} ${styles.chatLayout}`}>
-                <title>Khoj AI - Your Second Brain</title>
-                <div className={`${styles.chatBox}`}>
-                    <div className={`${styles.chatBoxBody}`}>
-                        <ChatBodyData
-                            isLoggedIn={authenticatedData !== null}
-                            chatOptionsData={chatOptionsData}
-                            setUploadedFiles={setUploadedFiles}
-                            isMobileWidth={isMobileWidth}
-                            onConversationIdChange={handleConversationIdChange}
-                            userConfig={userConfig}
-                            isLoadingUserConfig={isLoadingUserConfig}
-                        />
+            <SidebarInset>
+                <header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
+                    <SidebarTrigger className="-ml-1" />
+                    <Separator orientation="vertical" className="mr-2 h-4" />
+                    {isMobileWidth ? (
+                        <KhojLogoType className="h-auto w-16" />
+                    ) : (
+                        <h2 className="text-lg">Ask Anything</h2>
+                    )}
+                </header>
+                <div className={`${styles.main} ${styles.chatLayout}`}>
+                    <title>Khoj AI - Your Second Brain</title>
+                    <div className={`${styles.chatBox}`}>
+                        <div className={`${styles.chatBoxBody}`}>
+                            <ChatBodyData
+                                isLoggedIn={authenticatedData !== null}
+                                chatOptionsData={chatOptionsData}
+                                setUploadedFiles={setUploadedFiles}
+                                isMobileWidth={isMobileWidth}
+                                onConversationIdChange={handleConversationIdChange}
+                                userConfig={userConfig}
+                                isLoadingUserConfig={isLoadingUserConfig}
+                            />
+                        </div>
                     </div>
                 </div>
-            </div>
+            </SidebarInset>
         </SidebarProvider>
     );
 }