diff --git a/app/components/AppFooter.vue b/app/components/AppFooter.vue
index 6955352350..3548b118aa 100644
--- a/app/components/AppFooter.vue
+++ b/app/components/AppFooter.vue
@@ -20,27 +20,19 @@ const closeModal = () => modalRef.value?.close?.()
           </p>
           <BuildEnvironment v-if="!isHome" footer />
         </div>
-        <!-- Desktop: Show all links. Mobile: Links are in MobileMenu -->
-        <div class="hidden sm:flex flex-col lg:items-end gap-3 min-h-11 text-xs">
-          <div class="flex items-center gap-5">
-            <LinkBase :to="{ name: 'about' }">
-              {{ $t('footer.about') }}
-            </LinkBase>
-            <LinkBase :to="{ name: 'blog' }">
-              {{ $t('footer.blog') }}
-            </LinkBase>
-            <LinkBase :to="{ name: 'privacy' }">
-              {{ $t('privacy_policy.title') }}
-            </LinkBase>
-            <LinkBase :to="{ name: 'accessibility' }">
-              {{ $t('a11y.footer_title') }}
-            </LinkBase>
-            <LinkBase :to="{ name: 'translation-status' }">
-              {{ $t('translation_status.title') }}
-            </LinkBase>
+        <!-- Desktop: Show all links in columns. Mobile: Links are in MobileMenu -->
+        <div class="hidden sm:grid sm:grid-cols-2 lg:grid-cols-3 gap-x-10 gap-y-1 min-h-11 text-xs">
+          <!-- Column 1: Product -->
+          <div class="flex flex-col gap-1">
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{
+              $t('footer.product')
+            }}</span>
+            <LinkBase :to="{ name: 'about' }">{{ $t('footer.about') }}</LinkBase>
+            <LinkBase :to="{ name: 'blog' }">{{ $t('footer.blog') }}</LinkBase>
+            <LinkBase :to="NPMX_DOCS_SITE">{{ $t('footer.docs') }}</LinkBase>
             <button
               type="button"
-              class="cursor-pointer group inline-flex gap-x-1 items-center justify-center underline-offset-[0.2rem] underline decoration-1 decoration-fg/30 font-mono text-fg hover:(decoration-accent text-accent) focus-visible:(decoration-accent text-accent) transition-colors duration-200"
+              class="text-start cursor-pointer inline-flex gap-x-1 items-center underline-offset-[0.2rem] underline decoration-1 decoration-fg/30 font-mono text-fg hover:(decoration-accent text-accent) focus-visible:(decoration-accent text-accent) transition-colors duration-200"
               @click.prevent="showModal"
               aria-haspopup="dialog"
             >
@@ -126,19 +118,27 @@ const closeModal = () => modalRef.value?.close?.()
               </p>
             </Modal>
           </div>
-          <div class="flex items-center gap-5">
-            <LinkBase :to="NPMX_DOCS_SITE">
-              {{ $t('footer.docs') }}
-            </LinkBase>
-            <LinkBase to="https://repo.npmx.dev">
-              {{ $t('footer.source') }}
-            </LinkBase>
-            <LinkBase to="https://social.npmx.dev">
-              {{ $t('footer.social') }}
-            </LinkBase>
-            <LinkBase :to="discord.url">
-              {{ discord.label }}
-            </LinkBase>
+
+          <!-- Column 2: Legal & Info -->
+          <div class="flex flex-col gap-1">
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{
+              $t('footer.legal')
+            }}</span>
+            <LinkBase :to="{ name: 'privacy' }">{{ $t('privacy_policy.title') }}</LinkBase>
+            <LinkBase :to="{ name: 'accessibility' }">{{ $t('a11y.footer_title') }}</LinkBase>
+            <LinkBase :to="{ name: 'translation-status' }">{{
+              $t('translation_status.title')
+            }}</LinkBase>
+          </div>
+
+          <!-- Column 3: Community -->
+          <div class="flex flex-col gap-1">
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{
+              $t('footer.community')
+            }}</span>
+            <LinkBase to="https://repo.npmx.dev">{{ $t('footer.source') }}</LinkBase>
+            <LinkBase to="https://social.npmx.dev">{{ $t('footer.social') }}</LinkBase>
+            <LinkBase :to="discord.url">{{ discord.label }}</LinkBase>
           </div>
         </div>
       </div>
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 02c1af000f..f1518faec9 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -19,7 +19,10 @@
     "social": "social",
     "chat": "chat",
     "builders_chat": "builders",
-    "keyboard_shortcuts": "keyboard shortcuts"
+    "keyboard_shortcuts": "keyboard shortcuts",
+    "product": "Product",
+    "legal": "Legal",
+    "community": "Community"
   },
   "shortcuts": {
     "section": {
diff --git a/i18n/schema.json b/i18n/schema.json
index 885bd6eb5e..acc8bb80ad 100644
--- a/i18n/schema.json
+++ b/i18n/schema.json
@@ -63,6 +63,15 @@
         },
         "keyboard_shortcuts": {
           "type": "string"
+        },
+        "product": {
+          "type": "string"
+        },
+        "legal": {
+          "type": "string"
+        },
+        "community": {
+          "type": "string"
         }
       },
       "additionalProperties": false
diff --git a/test/nuxt/components/AppFooter.spec.ts b/test/nuxt/components/AppFooter.spec.ts
index f799f74235..c2498fffbf 100644
--- a/test/nuxt/components/AppFooter.spec.ts
+++ b/test/nuxt/components/AppFooter.spec.ts
@@ -4,6 +4,31 @@ import AppFooter from '~/components/AppFooter.vue'
 
 /* check nuxt module at modules/build-env.ts */
 describe('AppFooter', () => {
+  it('renders three labeled columns: Product, Legal, Community', async () => {
+    const component = await mountSuspended(AppFooter, {
+      route: '/',
+    })
+
+    // All three column label spans should be present
+    const columnLabels = component.findAll('span.tracking-wide')
+    expect(columnLabels.length).toBeGreaterThanOrEqual(3)
+
+    const labelTexts = columnLabels.map(span => span.text().toLowerCase())
+    expect(labelTexts.some(t => t.includes('product'))).toBe(true)
+    expect(labelTexts.some(t => t.includes('legal'))).toBe(true)
+    expect(labelTexts.some(t => t.includes('community'))).toBe(true)
+  })
+
+  it('footer contains links expected in the Product column', async () => {
+    const component = await mountSuspended(AppFooter, {
+      route: '/about',
+    })
+
+    // The Product column should link to /about and /blog
+    const aboutLink = component.find('a[href="/about"]')
+    expect(aboutLink.exists()).toBe(true)
+  })
+
   it('BuildEnvironment is properly displayed at settings', async () => {
     const buildInfo = useAppConfig().buildInfo
     const component = await mountSuspended(AppFooter, {