diff --git a/src/lib/head/Header.svelte b/src/lib/head/Header.svelte
index 971aff4..774035e 100644
--- a/src/lib/head/Header.svelte
+++ b/src/lib/head/Header.svelte
@@ -4,9 +4,45 @@
 	import ButtonGroup from '@/components/ui/button-group/button-group.svelte';
 	import { page } from '$app/state';
 	import { slide } from 'svelte/transition';
+	import { sesionStore } from '@/stores/usuario';
+	import { onMount } from 'svelte';
+	import { apiBase } from '@/stores/url';
 
 	let menuOpen = $state(false);
 	const toggleMenu = () => (menuOpen = !menuOpen);
+
+  let showCerrarSesion = $state(false);
+
+  onMount(()=>{
+       sesionStore.subscribe((value)=>{
+           showCerrarSesion = !!value?.accessToken;
+       })
+
+   });
+
+  async function cerrarSesion(){
+      try{
+          const req = await fetch($apiBase+"/api/auth/logout", {
+              method: 'POST',
+              headers: {
+                  "Content-Type": "application/json",
+                  "Authorization": `Bearer ${$sesionStore?.accessToken}`
+
+              },
+              credentials: "include"
+          });
+          if(req.ok){
+
+              sesionStore.reset();
+              menuOpen = false;
+          }
+      }catch{
+          console.log("fallo el lougout")
+      } finally{
+          sesionStore.reset();
+      }
+
+  }
 </script>
 
 <header class="border-b bg-background/95 backdrop-blur">
@@ -22,19 +58,24 @@
 
 		<!-- Desktop menu -->
 		<div class="hidden flex-1 items-center justify-end md:flex">
-			<ButtonGroup>
-				<Button
-					variant={page.url.pathname !== '/login' ? 'outline' : 'secondary'}
-					href="/login"
-					class="text-foreground/60 transition-colors hover:text-foreground/80"
-					>Iniciar Sesion</Button
-				>
-				<Button
-					variant={page.url.pathname !== '/register' ? 'outline' : 'secondary'}
-					href="/register"
-					class="text-foreground/60 transition-colors hover:text-foreground/80">Registrarse</Button
-				>
-			</ButtonGroup>
+			  <ButtonGroup>
+            {#if showCerrarSesion}
+                <Button onclick={cerrarSesion}> Cerrar Sesion
+                </Button>
+	          {:else}
+				        <Button
+					          variant={page.url.pathname !== '/login' ? 'outline' : 'secondary'}
+					          href="/login"
+					          class="text-foreground/60 transition-colors hover:text-foreground/80"
+					      >Iniciar Sesion
+                </Button>
+				        <Button
+					          variant={page.url.pathname !== '/register' ? 'outline' : 'secondary'}
+					          href="/register"
+					          class="text-foreground/60 transition-colors hover:text-foreground/80">Registrarse
+                </Button>
+            {/if}
+			  </ButtonGroup>
 		</div>
 
 		<!-- Mobile menu button -->
@@ -64,20 +105,25 @@
 	<!-- Mobile menu -->
 	{#if menuOpen}
 		<div class="md:hidden" transition:slide>
-			<div class="space-y-1 border-t bg-background/95 px-2 pt-2 pb-3">
-				<Button
-					variant={page.url.pathname !== '/login' ? 'outline' : 'secondary'}
-					href="/login"
-					class="mb-2 w-full justify-start text-foreground/60 transition-colors hover:text-foreground/80"
-					onclick={() => (menuOpen = false)}>Iniciar Sesion</Button
-				>
-				<Button
-					variant={page.url.pathname !== '/register' ? 'outline' : 'secondary'}
-					href="/register"
-					class="w-full justify-start text-foreground/60 transition-colors hover:text-foreground/80"
-					onclick={() => (menuOpen = false)}>Registrarse</Button
-				>
-			</div>
+			  <div class="space-y-1 border-t bg-background/95 px-2 pt-2 pb-3">
+            {#if showCerrarSesion}
+                <Button onclick={cerrarSesion}> Cerrar Sesion
+                </Button>
+	          {:else}
+				        <Button
+					          variant={page.url.pathname !== '/login' ? 'outline' : 'secondary'}
+					          href="/login"
+					          class="mb-2 w-full justify-start text-foreground/60 transition-colors hover:text-foreground/80"
+					          onclick={() => (menuOpen = false)}>Iniciar Sesion</Button
+				                                                             >
+				        <Button
+					          variant={page.url.pathname !== '/register' ? 'outline' : 'secondary'}
+					          href="/register"
+					          class="w-full justify-start text-foreground/60 transition-colors hover:text-foreground/80"
+					          onclick={() => (menuOpen = false)}>Registrarse
+                </Button>
+            {/if}
+			  </div>
 		</div>
 	{/if}
 </header>