diff --git a/src/app/project/app/[appId]/app-action-buttons.tsx b/src/app/project/app/[appId]/app-action-buttons.tsx
index f9ec70b..f183e3d 100644
--- a/src/app/project/app/[appId]/app-action-buttons.tsx
+++ b/src/app/project/app/[appId]/app-action-buttons.tsx
@@ -6,9 +6,10 @@ import { deploy, startApp, stopApp } from "./actions";
 import { AppExtendedModel } from "@/shared/model/app-extended.model";
 import { Toast } from "@/frontend/utils/toast.utils";
 import AppStatus from "./app-status";
-import { Hammer, Pause, Play, Rocket } from "lucide-react";
+import { ExternalLink, Hammer, Pause, Play, Rocket } from "lucide-react";
 import { toast } from "sonner";
 import { AppEventsDialog } from "./app-events-dialog";
+import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 
 export default function AppActionButtons({
     app
@@ -16,12 +17,22 @@ export default function AppActionButtons({
     app: AppExtendedModel;
 }) {
     return <Card>
-        <CardContent className="p-4 flex gap-4">
-            <div className="self-center"><AppEventsDialog app={app}><AppStatus appId={app.id} /></AppEventsDialog></div>
-            <Button onClick={() => Toast.fromAction(() => deploy(app.id))}><Rocket /> Deploy</Button>
-            <Button onClick={() => Toast.fromAction(() => deploy(app.id, true))} variant="secondary"><Hammer /> Rebuild</Button>
-            <Button onClick={() => Toast.fromAction(() => startApp(app.id))} variant="secondary"><Play />Start</Button>
-            <Button onClick={() => Toast.fromAction(() => stopApp(app.id))} variant="secondary"><Pause /> Stop</Button>
+        <CardContent className="p-4 ">
+            <ScrollArea>
+                <div className="flex gap-4">
+                    <div className="self-center"><AppEventsDialog app={app}><AppStatus appId={app.id} /></AppEventsDialog></div>
+                    <Button onClick={() => Toast.fromAction(() => deploy(app.id))}><Rocket /> Deploy</Button>
+                    <Button onClick={() => Toast.fromAction(() => deploy(app.id, true))} variant="secondary"><Hammer /> Rebuild</Button>
+                    <Button onClick={() => Toast.fromAction(() => startApp(app.id))} variant="secondary"><Play />Start</Button>
+                    <Button onClick={() => Toast.fromAction(() => stopApp(app.id))} variant="secondary"><Pause /> Stop</Button>
+                    {app.appDomains.length > 0 && <Button onClick={() => {
+                        const domain = app.appDomains[0];
+                        const protocol = domain.useSsl ? 'https' : 'http';
+                        window.open(`${protocol}://${domain.hostname}`, '_blank');
+                    }} variant="secondary"><ExternalLink /></Button>}
+                </div>
+                <ScrollBar orientation="horizontal" />
+            </ScrollArea>
         </CardContent>
     </Card >;
 }
\ No newline at end of file
diff --git a/src/app/project/app/[appId]/app-tabs.tsx b/src/app/project/app/[appId]/app-tabs.tsx
index d0a5218..6dcdc97 100644
--- a/src/app/project/app/[appId]/app-tabs.tsx
+++ b/src/app/project/app/[appId]/app-tabs.tsx
@@ -19,6 +19,7 @@ import DbCredentials from "./credentials/db-crendentials";
 import VolumeBackupList from "./volumes/volume-backup";
 import { VolumeBackupExtendedModel } from "@/shared/model/volume-backup-extended.model";
 import BasicAuth from "./advanced/basic-auth";
+import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 
 export default function AppTabs({
     app,
@@ -39,15 +40,19 @@ export default function AppTabs({
 
     return (
         <Tabs defaultValue="general" value={tabName} onValueChange={(newTab) => openTab(newTab)} className="space-y-4">
-            <TabsList>
-                <TabsTrigger value="overview">Overview</TabsTrigger>
-                {app.appType !== 'APP' && <TabsTrigger value="credentials">Credentials</TabsTrigger>}
-                <TabsTrigger value="general">General</TabsTrigger>
-                <TabsTrigger value="environment">Environment</TabsTrigger>
-                <TabsTrigger value="domains">Domains</TabsTrigger>
-                <TabsTrigger value="storage">Storage</TabsTrigger>
-                <TabsTrigger value="advanced">Advanced</TabsTrigger>
-            </TabsList>
+            <ScrollArea >
+                <TabsList>
+
+                    <TabsTrigger value="overview">Overview</TabsTrigger>
+                    {app.appType !== 'APP' && <TabsTrigger value="credentials">Credentials</TabsTrigger>}
+                    <TabsTrigger value="general">General</TabsTrigger>
+                    <TabsTrigger value="environment">Environment</TabsTrigger>
+                    <TabsTrigger value="domains">Domains</TabsTrigger>
+                    <TabsTrigger value="storage">Storage</TabsTrigger>
+                    <TabsTrigger value="advanced">Advanced</TabsTrigger>
+                </TabsList>
+                <ScrollBar orientation="horizontal" />
+            </ScrollArea>
             <TabsContent value="overview" className="grid grid-cols-1 3xl:grid-cols-2 gap-4">
                 <MonitoringTab app={app} />
                 <Logs app={app} />