diff --git a/src/components/HelpModal.vue b/src/components/HelpModal.vue
index 684c0b4..f65d978 100644
--- a/src/components/HelpModal.vue
+++ b/src/components/HelpModal.vue
@@ -18,7 +18,7 @@
       <!-- Tab Content -->
       <div class="flex-1 overflow-auto p-4 dark:bg-gray-800 dark:text-gray-200">
         <!-- About & Instructions Tab -->
-        <div v-if="activeTab === 1" class="h-full overflow-y-auto">
+        <div v-if="activeTab === 0" class="h-full overflow-y-auto">
           <h3 class="text-lg font-semibold mb-4">About Spritesheet generator</h3>
 
           <div class="max-w-none text-gray-700 dark:text-gray-300">
@@ -47,7 +47,7 @@
         </div>
 
         <!-- Donations Tab -->
-        <div v-if="activeTab === 2" class="h-full overflow-y-auto">
+        <div v-if="activeTab === 1" class="h-full overflow-y-auto">
           <h3 class="text-lg font-semibold mb-4">Support my <a href="https://adhd.sh" title="XVX" target="_blank" class="text-blue-500 hover:text-blue-600 transition-colors">projects</a>.</h3>
 
           <p class="mb-6">
@@ -122,7 +122,7 @@
         </div>
 
         <!-- Changelog Tab -->
-        <div v-if="activeTab === 3" class="h-full overflow-y-auto changelog-container">
+        <div v-if="activeTab === 2" class="h-full overflow-y-auto changelog-container">
           <h3 class="text-lg font-semibold mb-4">Changelog</h3>
 
           <div v-if="!changelogHtml" class="text-gray-500 text-center py-8">Loading changelog...</div>
@@ -150,7 +150,7 @@
     (e: 'close'): void;
   }>();
 
-  const activeTab = ref(1);
+  const activeTab = ref(0);
   const changelogHtml = ref<string>('');
 
   const tabs = [{ name: 'About & instructions' }, { name: 'Support the project' }, { name: 'Changelog' }];