diff --git a/lib/store.ts b/lib/store.ts
index 65e89e505..69d2ed5b9 100644
--- a/lib/store.ts
+++ b/lib/store.ts
@@ -7,6 +7,9 @@ import { persist } from 'zustand/middleware';
 interface SettingsStore {
   apiKey: string;
   setApiKey: (apiKey: string) => void;
+
+  wideMode: boolean;
+  setWideMode: (wideMode: boolean) => void;
 }
 
 export const useSettingsStore = create<SettingsStore>()(
@@ -17,6 +20,9 @@ export const useSettingsStore = create<SettingsStore>()(
         return localStorage.getItem('app-settings-openai-api-key') || '';
       })(),
       setApiKey: (apiKey: string) => set({ apiKey }),
+
+      wideMode: false,
+      setWideMode: (wideMode: boolean) => set({ wideMode }),
     }),
     {
       name: 'app-settings',
diff --git a/pages/index.tsx b/pages/index.tsx
index ebb507fde..29030e710 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -12,6 +12,7 @@ export default function Home() {
   const theme = useTheme();
 
   const apiKey = useSettingsStore(state => state.apiKey);
+  const wideMode = useSettingsStore(state => state.wideMode);
   const [settingsShown, setSettingsShown] = React.useState(false);
 
   React.useEffect(() => {
@@ -27,8 +28,8 @@ export default function Home() {
      */
     <NoSSR>
 
-      <Container maxWidth='xl' disableGutters sx={{
-        boxShadow: { xs: 'none', xl: theme.vars.shadow.lg },
+      <Container maxWidth={wideMode ? false : 'xl'} disableGutters sx={{
+        boxShadow: { xs: 'none', xl: wideMode ? 'none' : theme.vars.shadow.lg },
       }}>
 
         <ChatArea onShowSettings={() => setSettingsShown(true)} />