diff --git a/src/lib/components/settings.svelte b/src/lib/components/settings.svelte
index 99ba223..c7bb2e8 100644
--- a/src/lib/components/settings.svelte
+++ b/src/lib/components/settings.svelte
@@ -1,6 +1,12 @@
 <script>
 	import { navigate } from 'svelte-routing'
 	import { theme } from '$lib/components/store.js'
+	import { resetClient } from './store.js';
+	function reset() {
+		if (confirm("are you sure you want to reset client?")) {
+			resetClient()
+		}
+	}
 </script>
 
 <div id="settings-panel">
@@ -12,6 +18,7 @@
 			<option value="dark">Dark</option>
 			<option value="light">Light</option>
 		</select>
+		<button on:click={reset}>Reset Client Data</button>
 	</div>
 </div>
 <style>
diff --git a/src/lib/components/store.js b/src/lib/components/store.js
index d085578..5a61194 100644
--- a/src/lib/components/store.js
+++ b/src/lib/components/store.js
@@ -240,6 +240,7 @@ export async function authValidity() {
   if (res.token == localStorage.getItem('token')) {
     return true
   }
+  localStorage.removeItem('token')
   return false
 }
 
@@ -257,4 +258,12 @@ export function availableTags() {
     }
   })
   return get(tags)
+}
+
+export function resetClient() {
+  localStorage.removeItem('notes')
+  localStorage.removeItem('settings')
+  localStorage.removeItem('theme')
+  localStorage.removeItem('token')
+  location.reload()
 }
\ No newline at end of file
diff --git a/src/lib/css/main.css b/src/lib/css/main.css
index 27f12a6..15667f5 100644
--- a/src/lib/css/main.css
+++ b/src/lib/css/main.css
@@ -74,7 +74,7 @@ a:hover {
 button {
   --width: 46px;
   height: var(--width);
-  width: var(--width);
+  min-width: var(--width);
   padding: 10px;
   border: none;
   background: var(--bg);