diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index f5a7be8407..972d6aeca2 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,6 +1,8 @@
+import { useI18n } from '../i18n'
 import { getSiteName } from '../lib/site'
 
 export function Footer() {
+  const { t } = useI18n()
   const siteName = getSiteName()
   return (
     <footer className="site-footer">
@@ -8,21 +10,21 @@ export function Footer() {
         <div className="site-footer-divider" aria-hidden="true" />
         <div className="site-footer-row">
           <div className="site-footer-copy">
-            {siteName} · An{' '}
+            {siteName} · {t('footer.an')}{t('footer.an') ? ' ' : ''}
             <a href="https://openclaw.ai" target="_blank" rel="noreferrer">
-              OpenClaw
+              {t('footer.openClaw')}
             </a>{' '}
-            project · Deployed on{' '}
+            {t('footer.project')} · {t('footer.deployedOn')}{' '}
             <a href="https://vercel.com" target="_blank" rel="noreferrer">
               Vercel
             </a>{' '}
-            · Powered by{' '}
+            · {t('footer.poweredBy')}{' '}
             <a href="https://www.convex.dev" target="_blank" rel="noreferrer">
               Convex
             </a>{' '}
             ·{' '}
             <a href="https://github.com/openclaw/clawhub" target="_blank" rel="noreferrer">
-              Open source (MIT)
+              {t('footer.openSourceMIT')}
             </a>{' '}
             ·{' '}
             <a href="https://steipete.me" target="_blank" rel="noreferrer">
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 38adedb0cd..ec2bfed684 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -1,7 +1,9 @@
 import { useAuthActions } from '@convex-dev/auth/react'
 import { Link } from '@tanstack/react-router'
-import { Menu, Monitor, Moon, Sun } from 'lucide-react'
+import { Globe, Menu, Monitor, Moon, Sun } from 'lucide-react'
 import { useMemo, useRef } from 'react'
+import { useI18n } from '../i18n'
+import type { Locale } from '../i18n'
 import { gravatarUrl } from '../lib/gravatar'
 import { isModerator } from '../lib/roles'
 import { getClawHubSiteUrl, getSiteMode, getSiteName } from '../lib/site'
@@ -17,10 +19,16 @@ import {
 } from './ui/dropdown-menu'
 import { ToggleGroup, ToggleGroupItem } from './ui/toggle-group'
 
+const localeLabels: Record<Locale, string> = {
+  en: 'EN',
+  'zh-CN': '中文',
+}
+
 export default function Header() {
   const { isAuthenticated, isLoading, me } = useAuthStatus()
   const { signIn, signOut } = useAuthActions()
   const { mode, setMode } = useThemeMode()
+  const { t, locale, setLocale } = useI18n()
   const toggleRef = useRef<HTMLDivElement | null>(null)
   const siteMode = getSiteMode()
   const siteName = useMemo(() => getSiteName(siteMode), [siteMode])
@@ -72,7 +80,7 @@ export default function Header() {
                 focus: undefined,
               }}
             >
-              Souls
+              {t('header.souls')}
             </Link>
           ) : (
             <Link
@@ -87,13 +95,13 @@ export default function Header() {
                 focus: undefined,
               }}
             >
-              Skills
+              {t('header.skills')}
             </Link>
           )}
           <Link to="/upload" search={{ updateSlug: undefined }}>
-            Upload
+            {t('header.upload')}
           </Link>
-          {isSoulMode ? null : <Link to="/import">Import</Link>}
+          {isSoulMode ? null : <Link to="/import">{t('header.import')}</Link>}
           <Link
             to={isSoulMode ? '/souls' : '/skills'}
             search={
@@ -116,12 +124,12 @@ export default function Header() {
                   }
             }
           >
-            Search
+            {t('header.search')}
           </Link>
-          {me ? <Link to="/stars">Stars</Link> : null}
+          {me ? <Link to="/stars">{t('header.stars')}</Link> : null}
           {isStaff ? (
             <Link to="/management" search={{ skill: undefined }}>
-              Management
+              {t('header.management')}
             </Link>
           ) : null}
         </nav>
@@ -129,7 +137,7 @@ export default function Header() {
           <div className="nav-mobile">
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
-                <button className="nav-mobile-trigger" type="button" aria-label="Open menu">
+                <button className="nav-mobile-trigger" type="button" aria-label={t('header.openMenu')}>
                   <Menu className="h-4 w-4" aria-hidden="true" />
                 </button>
               </DropdownMenuTrigger>
@@ -151,7 +159,7 @@ export default function Header() {
                         focus: undefined,
                       }}
                     >
-                      Souls
+                      {t('header.souls')}
                     </Link>
                   ) : (
                     <Link
@@ -166,18 +174,18 @@ export default function Header() {
                         focus: undefined,
                       }}
                     >
-                      Skills
+                      {t('header.skills')}
                     </Link>
                   )}
                 </DropdownMenuItem>
                 <DropdownMenuItem asChild>
                   <Link to="/upload" search={{ updateSlug: undefined }}>
-                    Upload
+                    {t('header.upload')}
                   </Link>
                 </DropdownMenuItem>
                 {isSoulMode ? null : (
                   <DropdownMenuItem asChild>
-                    <Link to="/import">Import</Link>
+                    <Link to="/import">{t('header.import')}</Link>
                   </DropdownMenuItem>
                 )}
                 <DropdownMenuItem asChild>
@@ -203,33 +211,42 @@ export default function Header() {
                           }
                     }
                   >
-                    Search
+                    {t('header.search')}
                   </Link>
                 </DropdownMenuItem>
                 {me ? (
                   <DropdownMenuItem asChild>
-                    <Link to="/stars">Stars</Link>
+                    <Link to="/stars">{t('header.stars')}</Link>
                   </DropdownMenuItem>
                 ) : null}
                 {isStaff ? (
                   <DropdownMenuItem asChild>
                     <Link to="/management" search={{ skill: undefined }}>
-                      Management
+                      {t('header.management')}
                     </Link>
                   </DropdownMenuItem>
                 ) : null}
                 <DropdownMenuSeparator />
                 <DropdownMenuItem onClick={() => setTheme('system')}>
                   <Monitor className="h-4 w-4" aria-hidden="true" />
-                  System
+                  {t('header.system')}
                 </DropdownMenuItem>
                 <DropdownMenuItem onClick={() => setTheme('light')}>
                   <Sun className="h-4 w-4" aria-hidden="true" />
-                  Light
+                  {t('header.light')}
                 </DropdownMenuItem>
                 <DropdownMenuItem onClick={() => setTheme('dark')}>
                   <Moon className="h-4 w-4" aria-hidden="true" />
-                  Dark
+                  {t('header.dark')}
+                </DropdownMenuItem>
+                <DropdownMenuSeparator />
+                <DropdownMenuItem onClick={() => setLocale('en')}>
+                  <Globe className="h-4 w-4" aria-hidden="true" />
+                  EN
+                </DropdownMenuItem>
+                <DropdownMenuItem onClick={() => setLocale('zh-CN')}>
+                  <Globe className="h-4 w-4" aria-hidden="true" />
+                  中文
                 </DropdownMenuItem>
               </DropdownMenuContent>
             </DropdownMenu>
@@ -244,26 +261,42 @@ export default function Header() {
               }}
               aria-label="Theme mode"
             >
-              <ToggleGroupItem value="system" aria-label="System theme">
+              <ToggleGroupItem value="system" aria-label={t('header.systemTheme')}>
                 <Monitor className="h-4 w-4" aria-hidden="true" />
-                <span className="sr-only">System</span>
+                <span className="sr-only">{t('header.system')}</span>
               </ToggleGroupItem>
-              <ToggleGroupItem value="light" aria-label="Light theme">
+              <ToggleGroupItem value="light" aria-label={t('header.lightTheme')}>
                 <Sun className="h-4 w-4" aria-hidden="true" />
-                <span className="sr-only">Light</span>
+                <span className="sr-only">{t('header.light')}</span>
               </ToggleGroupItem>
-              <ToggleGroupItem value="dark" aria-label="Dark theme">
+              <ToggleGroupItem value="dark" aria-label={t('header.darkTheme')}>
                 <Moon className="h-4 w-4" aria-hidden="true" />
-                <span className="sr-only">Dark</span>
+                <span className="sr-only">{t('header.dark')}</span>
               </ToggleGroupItem>
             </ToggleGroup>
           </div>
+          <DropdownMenu>
+            <DropdownMenuTrigger asChild>
+              <button className="btn btn-ghost btn-sm" type="button" aria-label={t('header.language')}>
+                <Globe className="h-4 w-4" />
+                <span>{localeLabels[locale]}</span>
+              </button>
+            </DropdownMenuTrigger>
+            <DropdownMenuContent align="end">
+              <DropdownMenuItem onClick={() => setLocale('en')}>
+                EN
+              </DropdownMenuItem>
+              <DropdownMenuItem onClick={() => setLocale('zh-CN')}>
+                中文
+              </DropdownMenuItem>
+            </DropdownMenuContent>
+          </DropdownMenu>
           {isAuthenticated && me ? (
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
                 <button className="user-trigger" type="button">
                   {avatar ? (
-                    <img src={avatar} alt={me.displayName ?? me.name ?? 'User avatar'} />
+                    <img src={avatar} alt={me.displayName ?? me.name ?? t('header.userAvatar')} />
                   ) : (
                     <span className="user-menu-fallback">{initial}</span>
                   )}
@@ -273,13 +306,13 @@ export default function Header() {
               </DropdownMenuTrigger>
               <DropdownMenuContent align="end">
                 <DropdownMenuItem asChild>
-                  <Link to="/dashboard">Dashboard</Link>
+                  <Link to="/dashboard">{t('header.dashboard')}</Link>
                 </DropdownMenuItem>
                 <DropdownMenuItem asChild>
-                  <Link to="/settings">Settings</Link>
+                  <Link to="/settings">{t('header.settings')}</Link>
                 </DropdownMenuItem>
                 <DropdownMenuSeparator />
-                <DropdownMenuItem onClick={() => void signOut()}>Sign out</DropdownMenuItem>
+                <DropdownMenuItem onClick={() => void signOut()}>{t('header.signOut')}</DropdownMenuItem>
               </DropdownMenuContent>
             </DropdownMenu>
           ) : (
@@ -294,8 +327,8 @@ export default function Header() {
                 )
               }
             >
-              <span className="sign-in-label">Sign in</span>
-              <span className="sign-in-provider">with GitHub</span>
+              <span className="sign-in-label">{t('header.signIn')}</span>
+              <span className="sign-in-provider">{t('header.withGitHub')}</span>
             </button>
           )}
         </div>
diff --git a/src/components/InstallSwitcher.tsx b/src/components/InstallSwitcher.tsx
index 5909ac3b66..50623ebf91 100644
--- a/src/components/InstallSwitcher.tsx
+++ b/src/components/InstallSwitcher.tsx
@@ -1,4 +1,5 @@
 import { useMemo, useState } from 'react'
+import { useI18n } from '../i18n/useI18n'
 
 type PackageManager = 'npm' | 'pnpm' | 'bun'
 
@@ -13,6 +14,7 @@ const PACKAGE_MANAGERS: Array<{ id: PackageManager; label: string }> = [
 ]
 
 export function InstallSwitcher({ exampleSlug = 'sonoscli' }: InstallSwitcherProps) {
+  const { t } = useI18n()
   const [pm, setPm] = useState<PackageManager>('npm')
 
   const command = useMemo(() => {
@@ -29,8 +31,8 @@ export function InstallSwitcher({ exampleSlug = 'sonoscli' }: InstallSwitcherPro
   return (
     <div className="install-switcher">
       <div className="install-switcher-row">
-        <div className="stat">Install any skill folder in one shot:</div>
-        <div className="install-switcher-toggle" role="tablist" aria-label="Install command">
+        <div className="stat">{t('installSwitcher.instruction')}</div>
+        <div className="install-switcher-toggle" role="tablist" aria-label={t('installSwitcher.ariaLabel')}>
           {PACKAGE_MANAGERS.map((entry) => (
             <button
               key={entry.id}
diff --git a/src/components/SkillCommentsPanel.tsx b/src/components/SkillCommentsPanel.tsx
index f511108afc..264371afff 100644
--- a/src/components/SkillCommentsPanel.tsx
+++ b/src/components/SkillCommentsPanel.tsx
@@ -2,6 +2,7 @@ import { useMutation, useQuery } from 'convex/react'
 import { useState } from 'react'
 import { api } from '../../convex/_generated/api'
 import type { Doc, Id } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n/useI18n'
 import { isModerator } from '../lib/roles'
 
 type SkillCommentsPanelProps = {
@@ -10,7 +11,7 @@ type SkillCommentsPanelProps = {
   me: Doc<'users'> | null
 }
 
-function formatReportError(error: unknown) {
+function formatReportError(error: unknown, fallback: string) {
   if (error instanceof Error) {
     const cleaned = error.message
       .replace(/\[CONVEX[^\]]*\]\s*/g, '')
@@ -20,10 +21,11 @@ function formatReportError(error: unknown) {
       .trim()
     if (cleaned && cleaned !== 'Server Error') return cleaned
   }
-  return 'Failed to report comment'
+  return fallback
 }
 
 export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommentsPanelProps) {
+  const { t } = useI18n()
   const addComment = useMutation(api.comments.add)
   const removeComment = useMutation(api.comments.remove)
   const reportComment = useMutation(api.comments.report)
@@ -86,7 +88,7 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
     if (isSubmittingReport) return
     const reason = reportReason.trim()
     if (!reason) {
-      setReportError('Report reason required.')
+      setReportError(t('skillComments.reportReasonRequired'))
       return
     }
 
@@ -100,7 +102,7 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
       )
       closeReportForm()
     } catch (error) {
-      setReportError(formatReportError(error))
+      setReportError(formatReportError(error, t('skillComments.reportFailed')))
       setIsSubmittingReport(false)
     }
   }
@@ -108,7 +110,7 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
   return (
     <div className="card">
       <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-        Comments
+        {t('skillComments.title')}
       </h2>
       {isAuthenticated ? (
         <form
@@ -123,22 +125,22 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
             rows={4}
             value={comment}
             onChange={(event) => setComment(event.target.value)}
-            placeholder="Leave a note…"
+            placeholder={t('skillComments.placeholder')}
             disabled={isSubmitting}
           />
           {submitError ? <div className="report-dialog-error">{submitError}</div> : null}
           <button className="btn comment-submit" type="submit" disabled={isSubmitting}>
-            {isSubmitting ? 'Posting…' : 'Post comment'}
+            {isSubmitting ? t('skillComments.posting') : t('skillComments.postComment')}
           </button>
         </form>
       ) : (
-        <p className="section-subtitle">Sign in to comment.</p>
+        <p className="section-subtitle">{t('skillComments.signInToComment')}</p>
       )}
       {deleteError ? <div className="report-dialog-error">{deleteError}</div> : null}
       {reportNotice ? <div className="stat">{reportNotice}</div> : null}
       <div style={{ display: 'grid', gap: 12, marginTop: 16 }}>
         {(comments ?? []).length === 0 ? (
-          <div className="stat">No comments yet.</div>
+          <div className="stat">{t('skillComments.noComments')}</div>
         ) : (
           (comments ?? []).map((entry) => (
             <div key={entry.comment._id} className="comment-item">
@@ -158,7 +160,7 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
                       rows={3}
                       value={reportReason}
                       onChange={(event) => setReportReason(event.target.value)}
-                      placeholder="Why are you reporting this comment?"
+                      placeholder={t('skillComments.reportPlaceholder')}
                       disabled={isSubmittingReport}
                     />
                     <div className="comment-report-actions">
@@ -168,15 +170,15 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
                         onClick={closeReportForm}
                         disabled={isSubmittingReport}
                       >
-                        Cancel
+                        {t('skillComments.cancel')}
                       </button>
                       <button className="btn comment-submit" type="submit" disabled={isSubmittingReport}>
-                        {isSubmittingReport ? 'Reporting…' : 'Submit report'}
+                        {isSubmittingReport ? t('skillComments.reporting') : t('skillComments.submitReport')}
                       </button>
                     </div>
                     {reportError ? <div className="report-dialog-error">{reportError}</div> : null}
                     <div className="stat">
-                      Reports require a reason. Abuse of reporting may result in bans.
+                      {t('skillComments.reportWarning')}
                     </div>
                   </form>
                 ) : null}
@@ -190,7 +192,7 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
                       onClick={() => void deleteComment(entry.comment._id)}
                       disabled={Boolean(deletingCommentId) || isSubmitting || isSubmittingReport}
                     >
-                      {deletingCommentId === entry.comment._id ? 'Deleting…' : 'Delete'}
+                      {deletingCommentId === entry.comment._id ? t('skillComments.deleting') : t('skillComments.delete')}
                     </button>
                   ) : null}
                   {me._id !== entry.comment.userId ? (
@@ -204,7 +206,7 @@ export function SkillCommentsPanel({ skillId, isAuthenticated, me }: SkillCommen
                         (Boolean(reportingCommentId) && reportingCommentId !== entry.comment._id)
                       }
                     >
-                      {reportingCommentId === entry.comment._id ? 'Report open' : 'Report'}
+                      {reportingCommentId === entry.comment._id ? t('skillComments.reportOpen') : t('skillComments.report')}
                     </button>
                   ) : null}
                 </div>
diff --git a/src/components/SkillDetailPage.tsx b/src/components/SkillDetailPage.tsx
index 694999b158..9e8937ac4a 100644
--- a/src/components/SkillDetailPage.tsx
+++ b/src/components/SkillDetailPage.tsx
@@ -18,6 +18,7 @@ import {
   formatOsList,
   stripFrontmatter,
 } from './skillDetailUtils'
+import { useI18n } from '../i18n/useI18n'
 
 type SkillDetailPageProps = {
   slug: string
@@ -70,7 +71,7 @@ function formatReportError(error: unknown) {
     if (cleaned && cleaned !== 'Server Error') return cleaned
   }
 
-  return 'Unable to submit report. Please try again.'
+  return null
 }
 
 export function SkillDetailPage({
@@ -80,6 +81,7 @@ export function SkillDetailPage({
 }: SkillDetailPageProps) {
   const navigate = useNavigate()
   const { isAuthenticated, me } = useAuthStatus()
+  const { t } = useI18n()
 
   const isStaff = isModerator(me)
   const staffResult = useQuery(api.skills.getBySlugForStaff, isStaff ? { slug } : 'skip') as
@@ -159,18 +161,18 @@ export function SkillDetailPage({
   const isRemoved = moderationStatus === 'removed'
   const isAutoHidden = isHidden && staffSkill?.moderationReason === 'auto.reports'
   const staffVisibilityTag = isRemoved
-    ? 'Removed'
+    ? t('skillDetail.tagRemoved')
     : isAutoHidden
-      ? 'Auto-hidden'
+      ? t('skillDetail.tagAutoHidden')
       : isHidden
-        ? 'Hidden'
+        ? t('skillDetail.tagHidden')
         : null
   const staffModerationNote = staffVisibilityTag
     ? isAutoHidden
-      ? 'Auto-hidden after 4+ unique reports.'
+      ? t('skillDetail.autoHidden')
       : isRemoved
-        ? 'Removed from public view.'
-        : 'Hidden from public view.'
+        ? t('skillDetail.removedFromView')
+        : t('skillDetail.hiddenFromView')
     : null
 
   const versionById = new Map<Id<'skillVersions'>, Doc<'skillVersions'>>(
@@ -261,7 +263,7 @@ export function SkillDetailPage({
 
     const trimmedReason = reportReason.trim()
     if (!trimmedReason) {
-      setReportError('Report reason required.')
+      setReportError(t('skillDetail.reportReasonRequired'))
       return
     }
 
@@ -271,13 +273,13 @@ export function SkillDetailPage({
       const submission = await reportSkill({ skillId: skill._id, reason: trimmedReason })
       closeReportDialog()
       if (submission.reported) {
-        window.alert('Thanks — your report has been submitted.')
+        window.alert(t('skillDetail.reportSubmitted'))
       } else {
-        window.alert('You have already reported this skill.')
+        window.alert(t('skillDetail.alreadyReported'))
       }
     } catch (error) {
       console.error('Failed to report skill', error)
-      setReportError(formatReportError(error))
+      setReportError(formatReportError(error) ?? t('skillDetail.reportError'))
       setIsSubmittingReport(false)
     }
   }
@@ -286,7 +288,7 @@ export function SkillDetailPage({
     return (
       <main className="section">
         <div className="card">
-          <div className="loading-indicator">Loading skill…</div>
+          <div className="loading-indicator">{t('skillDetail.loading')}</div>
         </div>
       </main>
     )
@@ -295,7 +297,7 @@ export function SkillDetailPage({
   if (result === null || !skill) {
     return (
       <main className="section">
-        <div className="card">Skill not found.</div>
+        <div className="card">{t('skillDetail.notFound')}</div>
       </main>
     )
   }
diff --git a/src/components/SkillDetailTabs.tsx b/src/components/SkillDetailTabs.tsx
index c213ade1a1..f991f68fc3 100644
--- a/src/components/SkillDetailTabs.tsx
+++ b/src/components/SkillDetailTabs.tsx
@@ -1,5 +1,6 @@
 import { lazy, Suspense } from 'react'
 import type { Doc, Id } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n/useI18n'
 import { SkillVersionsPanel } from './SkillVersionsPanel'
 
 const SkillDiffCard = lazy(() =>
@@ -39,6 +40,7 @@ export function SkillDetailTabs({
   versions,
   nixPlugin,
 }: SkillDetailTabsProps) {
+  const { t } = useI18n()
   return (
     <div className="card tab-card">
       <div className="tab-header">
@@ -47,7 +49,7 @@ export function SkillDetailTabs({
           type="button"
           onClick={() => setActiveTab('files')}
         >
-          Files
+          {t('skillTabs.files')}
         </button>
         <button
           className={`tab-button${activeTab === 'compare' ? ' is-active' : ''}`}
@@ -62,19 +64,19 @@ export function SkillDetailTabs({
             void import('./SkillDiffCard')
           }}
         >
-          Compare
+          {t('skillTabs.compare')}
         </button>
         <button
           className={`tab-button${activeTab === 'versions' ? ' is-active' : ''}`}
           type="button"
           onClick={() => setActiveTab('versions')}
         >
-          Versions
+          {t('skillTabs.versions')}
         </button>
       </div>
 
       {activeTab === 'files' ? (
-        <Suspense fallback={<div className="tab-body stat">Loading file viewer…</div>}>
+        <Suspense fallback={<div className="tab-body stat">{t('skillTabs.loadingFileViewer')}</div>}>
           <SkillFilesPanel
             versionId={latestVersionId}
             readmeContent={readmeContent}
@@ -86,7 +88,7 @@ export function SkillDetailTabs({
 
       {activeTab === 'compare' ? (
         <div className="tab-body">
-          <Suspense fallback={<div className="stat">Loading diff viewer…</div>}>
+          <Suspense fallback={<div className="stat">{t('skillTabs.loadingDiffViewer')}</div>}>
             <SkillDiffCard skill={skill} versions={diffVersions ?? []} variant="embedded" />
           </Suspense>
         </div>
diff --git a/src/components/SkillDiffCard.tsx b/src/components/SkillDiffCard.tsx
index 871edc7f9d..c33e232848 100644
--- a/src/components/SkillDiffCard.tsx
+++ b/src/components/SkillDiffCard.tsx
@@ -3,6 +3,7 @@ import { DiffEditor, useMonaco } from '@monaco-editor/react'
 import { useAction } from 'convex/react'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { api } from '../../convex/_generated/api'
+import { useI18n } from '../i18n/useI18n'
 import type { Doc, Id } from '../../convex/_generated/dataModel'
 import {
   buildFileDiffList,
@@ -39,6 +40,7 @@ const EMPTY_DIFF_TEXT = ''
 
 export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCardProps) {
   const getFileText = useAction(api.skills.getFileText)
+  const { t } = useI18n()
   const monaco = useMonaco()
   const [viewMode, setViewMode] = useState<'split' | 'inline'>('split')
   const [leftVersionId, setLeftVersionId] = useState<Id<'skillVersions'> | null>(null)
@@ -248,34 +250,34 @@ export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCa
       <div className="diff-header">
         <div>
           <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-            Compare versions
+            {t('skillDiff.title')}
           </h2>
           <p className="section-subtitle" style={{ margin: 0 }}>
-            Inline or side-by-side diff for any file.
+            {t('skillDiff.subtitle')}
           </p>
         </div>
         <fieldset className="diff-toggle-group">
-          <legend className="sr-only">Diff layout</legend>
+          <legend className="sr-only">{t('skillDiff.diffLayout')}</legend>
           <button
             className={`diff-toggle${viewMode === 'split' ? ' is-active' : ''}`}
             type="button"
             onClick={() => setViewMode('split')}
           >
-            Side-by-side
+            {t('skillDiff.sideBySide')}
           </button>
           <button
             className={`diff-toggle${viewMode === 'inline' ? ' is-active' : ''}`}
             type="button"
             onClick={() => setViewMode('inline')}
           >
-            Inline
+            {t('skillDiff.inline')}
           </button>
         </fieldset>
       </div>
 
       <div className="diff-controls">
         <div className="diff-select">
-          <label htmlFor="diff-left">Left</label>
+          <label htmlFor="diff-left">{t('skillDiff.left')}</label>
           <select
             id="diff-left"
             className="search-input"
@@ -283,7 +285,7 @@ export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCa
             onChange={(event) => setLeftVersionId(event.target.value as Id<'skillVersions'>)}
           >
             <option value="" disabled>
-              Select version
+              {t('skillDiff.selectVersion')}
             </option>
             {renderOptions(versionOptions)}
           </select>
@@ -297,10 +299,10 @@ export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCa
           }}
           disabled={!leftVersionId || !rightVersionId}
         >
-          Swap
+          {t('skillDiff.swap')}
         </button>
         <div className="diff-select">
-          <label htmlFor="diff-right">Right</label>
+          <label htmlFor="diff-right">{t('skillDiff.right')}</label>
           <select
             id="diff-right"
             className="search-input"
@@ -308,7 +310,7 @@ export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCa
             onChange={(event) => setRightVersionId(event.target.value as Id<'skillVersions'>)}
           >
             <option value="" disabled>
-              Select version
+              {t('skillDiff.selectVersion')}
             </option>
             {renderOptions(versionOptions)}
           </select>
@@ -317,15 +319,15 @@ export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCa
 
       <div className="diff-meta">
         <span>
-          Left {leftLabel} • Right {rightLabel}
+          {t('skillDiff.leftRight', { leftLabel, rightLabel })}
         </span>
-        {diffUnavailable ? <span>Need at least 2 versions.</span> : null}
+        {diffUnavailable ? <span>{t('skillDiff.needTwoVersions')}</span> : null}
       </div>
 
       <div className="diff-layout">
         <div className="diff-files">
           {fileDiffItems.length === 0 ? (
-            <div className="diff-empty">No files to compare.</div>
+            <div className="diff-empty">{t('skillDiff.noFilesToCompare')}</div>
           ) : (
             fileDiffItems.map((item) => (
               <button
@@ -345,26 +347,25 @@ export function SkillDiffCard({ skill, versions, variant = 'card' }: SkillDiffCa
             <div className="diff-empty">{error}</div>
           ) : sizeWarning ? (
             <div className="diff-empty">
-              {sizeWarning.side === 'left' ? 'Left' : 'Right'} file exceeds 200KB:{' '}
-              {sizeWarning.path}
+              {sizeWarning.side === 'left' ? t('skillDiff.leftExceeds', { name: sizeWarning.path }) : t('skillDiff.rightExceeds', { name: sizeWarning.path })}
             </div>
           ) : diffUnavailable ? (
-            <div className="diff-empty">Publish another version to compare.</div>
+            <div className="diff-empty">{t('skillDiff.publishAnother')}</div>
           ) : !selectionReady ? (
-            <div className="diff-empty">Select two versions to compare.</div>
+            <div className="diff-empty">{t('skillDiff.selectTwoVersions')}</div>
           ) : !fileSelected ? (
-            <div className="diff-empty">Select a file to compare.</div>
+            <div className="diff-empty">{t('skillDiff.selectFileToCompare')}</div>
           ) : (
-            <ClientOnly fallback={<div className="diff-empty">Preparing diff…</div>}>
+            <ClientOnly fallback={<div className="diff-empty">{t('skillDiff.preparingDiff')}</div>}>
               <DiffEditor
                 className="diff-monaco"
                 original={leftText}
                 modified={rightText}
                 theme={getMonacoThemeName()}
-                loading={<div className="diff-empty">Loading diff…</div>}
+                loading={<div className="diff-empty">{t('skillDiff.loadingDiff')}</div>}
                 options={buildDiffOptions(viewMode)}
               />
-              {isLoading ? <div className="diff-loading">Loading…</div> : null}
+              {isLoading ? <div className="diff-loading">{t('skillDiff.loadingDiff')}</div> : null}
             </ClientOnly>
           )}
         </div>
diff --git a/src/components/SkillFilesPanel.tsx b/src/components/SkillFilesPanel.tsx
index 54218ebeab..cb2b133fc2 100644
--- a/src/components/SkillFilesPanel.tsx
+++ b/src/components/SkillFilesPanel.tsx
@@ -4,6 +4,7 @@ import ReactMarkdown from 'react-markdown'
 import remarkGfm from 'remark-gfm'
 import { api } from '../../convex/_generated/api'
 import type { Doc, Id } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n/useI18n'
 import { formatBytes } from './skillDetailUtils'
 
 type SkillFile = Doc<'skillVersions'>['files'][number]
@@ -21,6 +22,7 @@ export function SkillFilesPanel({
   readmeError,
   latestFiles,
 }: SkillFilesPanelProps) {
+  const { t } = useI18n()
   const getFileText = useAction(api.skills.getFileText)
   const [selectedPath, setSelectedPath] = useState<string | null>(null)
   const [fileContent, setFileContent] = useState<string | null>(null)
@@ -94,15 +96,15 @@ export function SkillFilesPanel({
     <div className="tab-body">
       <div>
         <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-          SKILL.md
+          {t('skillFiles.skillMd')}
         </h2>
         <div className="markdown">
           {readmeContent ? (
             <ReactMarkdown remarkPlugins={[remarkGfm]}>{readmeContent}</ReactMarkdown>
           ) : readmeError ? (
-            <div className="stat">Failed to load SKILL.md: {readmeError}</div>
+            <div className="stat">{t('skillFiles.loadFailed', { error: readmeError ?? '' })}</div>
           ) : (
-            <div>Loading…</div>
+            <div>{t('skillFiles.loading')}</div>
           )}
         </div>
       </div>
@@ -110,15 +112,15 @@ export function SkillFilesPanel({
         <div className="file-list">
           <div className="file-list-header">
             <h3 className="section-title" style={{ fontSize: '1.05rem', margin: 0 }}>
-              Files
+              {t('skillFiles.files')}
             </h3>
             <span className="section-subtitle" style={{ margin: 0 }}>
-              {latestFiles.length} total
+              {t('skillFiles.totalCount', { count: String(latestFiles.length) })}
             </span>
           </div>
           <div className="file-list-body">
             {latestFiles.length === 0 ? (
-              <div className="stat">No files available.</div>
+              <div className="stat">{t('skillFiles.noFiles')}</div>
             ) : (
               latestFiles.map((file) => (
                 <button
@@ -139,7 +141,7 @@ export function SkillFilesPanel({
         </div>
         <div className="file-viewer">
           <div className="file-viewer-header">
-            <div className="file-path">{selectedPath ?? 'Select a file'}</div>
+            <div className="file-path">{selectedPath ?? t('skillFiles.selectFile')}</div>
             {fileMeta ? (
               <span className="file-meta">
                 {formatBytes(fileMeta.size)} · {fileMeta.sha256.slice(0, 12)}…
@@ -148,13 +150,13 @@ export function SkillFilesPanel({
           </div>
           <div className="file-viewer-body">
             {isLoading ? (
-              <div className="stat">Loading…</div>
+              <div className="stat">{t('skillFiles.loading')}</div>
             ) : fileError ? (
-              <div className="stat">Failed to load file: {fileError}</div>
+              <div className="stat">{t('skillFiles.fileLoadFailed', { error: fileError ?? '' })}</div>
             ) : fileContent ? (
               <pre className="file-viewer-code">{fileContent}</pre>
             ) : (
-              <div className="stat">Select a file to preview.</div>
+              <div className="stat">{t('skillFiles.selectFilePreview')}</div>
             )}
           </div>
         </div>
diff --git a/src/components/SkillHeader.tsx b/src/components/SkillHeader.tsx
index b24f904c65..e6a8370a60 100644
--- a/src/components/SkillHeader.tsx
+++ b/src/components/SkillHeader.tsx
@@ -12,6 +12,7 @@ import type { PublicSkill, PublicUser } from '../lib/publicUser'
 import { type LlmAnalysis, SecurityScanResults } from './SkillSecurityScanResults'
 import { SkillInstallCard } from './SkillInstallCard'
 import { UserBadge } from './UserBadge'
+import { useI18n } from '../i18n/useI18n'
 
 export type SkillModerationInfo = {
   isPendingScan: boolean
@@ -112,35 +113,29 @@ export function SkillHeader({
   osLabels,
 }: SkillHeaderProps) {
   const formattedStats = formatSkillStatsTriplet(skill.stats)
+  const { t } = useI18n()
 
   return (
     <>
       {modInfo?.isPendingScan ? (
         <div className="pending-banner">
           <div className="pending-banner-content">
-            <strong>Security scan in progress</strong>
-            <p>
-              Your skill is being scanned by VirusTotal. It will be visible to others once the scan
-              completes. This usually takes up to 5 minutes — grab a coffee or exfoliate your shell
-              while you wait.
-            </p>
+            <strong>{t('skillHeader.scanInProgress')}</strong>
+            <p>{t('skillHeader.scanDescription')}</p>
           </div>
         </div>
       ) : modInfo?.isMalwareBlocked ? (
         <div className="pending-banner pending-banner-blocked">
           <div className="pending-banner-content">
-            <strong>Skill blocked — malicious content detected</strong>
-            <p>
-              ClawHub Security flagged this skill as malicious. Downloads are disabled. Review the
-              scan results below.
-            </p>
+            <strong>{t('skillHeader.blockedTitle')}</strong>
+            <p>{t('skillHeader.blockedDescription')}</p>
           </div>
         </div>
       ) : modInfo?.isSuspicious ? (
         <div className="pending-banner pending-banner-warning">
           <div className="pending-banner-content">
-            <strong>Skill flagged — suspicious patterns detected</strong>
-            <p>ClawHub Security flagged this skill as suspicious. Review the scan results before using.</p>
+            <strong>{t('skillHeader.suspiciousTitle')}</strong>
+            <p>{t('skillHeader.suspiciousDescription')}</p>
             {canManage ? (
               <p className="pending-banner-appeal">
                 If you believe this skill has been incorrectly flagged, please{' '}
@@ -159,15 +154,15 @@ export function SkillHeader({
       ) : modInfo?.isRemoved ? (
         <div className="pending-banner pending-banner-blocked">
           <div className="pending-banner-content">
-            <strong>Skill removed by moderator</strong>
-            <p>This skill has been removed and is not visible to others.</p>
+            <strong>{t('skillHeader.removedTitle')}</strong>
+            <p>{t('skillHeader.removedDescription')}</p>
           </div>
         </div>
       ) : modInfo?.isHiddenByMod ? (
         <div className="pending-banner pending-banner-blocked">
           <div className="pending-banner-content">
-            <strong>Skill hidden</strong>
-            <p>This skill is currently hidden and not visible to others.</p>
+            <strong>{t('skillHeader.hiddenTitle')}</strong>
+            <p>{t('skillHeader.hiddenDescription')}</p>
           </div>
         </div>
       ) : null}
@@ -180,16 +175,16 @@ export function SkillHeader({
                 <h1 className="section-title" style={{ margin: 0 }}>
                   {skill.displayName}
                 </h1>
-                {nixPlugin ? <span className="tag tag-accent">Plugin bundle (nix)</span> : null}
+                {nixPlugin ? <span className="tag tag-accent">{t('skillHeader.pluginBundle')}</span> : null}
               </div>
-              <p className="section-subtitle">{skill.summary ?? 'No summary provided.'}</p>
+              <p className="section-subtitle">{skill.summary ?? t('skillHeader.noSummary')}</p>
 
               {isStaff && staffModerationNote ? (
                 <div className="skill-hero-note">{staffModerationNote}</div>
               ) : null}
               {nixPlugin ? (
                 <div className="skill-hero-note">
-                  Bundles the skill pack, CLI binary, and config requirements in one Nix install.
+                  {t('skillHeader.bundleNote')}
                 </div>
               ) : null}
               <div className="skill-hero-note">
@@ -197,8 +192,7 @@ export function SkillHeader({
               </div>
               <div className="stat">
                 ⭐ {formattedStats.stars} · <Package size={14} aria-hidden="true" />{' '}
-                {formattedStats.downloads} · {formatCompactStat(skill.stats.installsCurrent ?? 0)} current
-                installs · {formattedStats.installsAllTime} all-time installs
+                {formattedStats.downloads} · {formatCompactStat(skill.stats.installsCurrent ?? 0)} {t('skillHeader.currentInstalls')} · {formattedStats.installsAllTime} {t('skillHeader.allTimeInstalls')}
               </div>
               <div className="stat">
                 <UserBadge user={owner} fallbackHandle={ownerHandle} prefix="by" size="md" showName />
@@ -215,7 +209,7 @@ export function SkillHeader({
               ) : null}
               {canonicalHref ? (
                 <div className="stat">
-                  canonical:{' '}
+                  {t('skillHeader.canonical')}{' '}
                   <a href={canonicalHref}>
                     {canonicalOwnerHandle ? `@${canonicalOwnerHandle}/` : ''}
                     {canonical?.skill?.slug}
@@ -239,19 +233,19 @@ export function SkillHeader({
                     className={`star-toggle${isStarred ? ' is-active' : ''}`}
                     type="button"
                     onClick={onToggleStar}
-                    aria-label={isStarred ? 'Unstar skill' : 'Star skill'}
+                    aria-label={isStarred ? t('skillHeader.unstarSkill') : t('skillHeader.starSkill')}
                   >
                     <span aria-hidden="true">★</span>
                   </button>
                 ) : null}
                 {isAuthenticated ? (
                   <button className="btn btn-ghost" type="button" onClick={onOpenReport}>
-                    Report
+                    {t('skillHeader.report')}
                   </button>
                 ) : null}
                 {isStaff ? (
                   <Link className="btn" to="/management" search={{ skill: skill.slug }}>
-                    Manage
+                    {t('skillHeader.manage')}
                   </Link>
                 ) : null}
               </div>
@@ -262,13 +256,13 @@ export function SkillHeader({
               />
               {latestVersion?.sha256hash || latestVersion?.llmAnalysis ? (
                 <p className="scan-disclaimer">
-                  Like a lobster shell, security has layers — review code before you run it.
+                  {t('skillHeader.securityDisclaimer')}
                 </p>
               ) : null}
             </div>
             <div className="skill-hero-cta">
               <div className="skill-version-pill">
-                <span className="skill-version-label">Current version</span>
+                <span className="skill-version-label">{t('skillHeader.currentVersion')}</span>
                 <strong>v{latestVersion?.version ?? '—'}</strong>
               </div>
               {!nixPlugin && !modInfo?.isMalwareBlocked && !modInfo?.isRemoved ? (
@@ -276,7 +270,7 @@ export function SkillHeader({
                   className="btn btn-primary"
                   href={`${import.meta.env.VITE_CONVEX_SITE_URL}/api/v1/download?slug=${skill.slug}`}
                 >
-                  Download zip
+                  {t('skillHeader.downloadZip')}
                 </a>
               ) : null}
             </div>
@@ -284,27 +278,27 @@ export function SkillHeader({
           {hasPluginBundle ? (
             <div className="skill-panel bundle-card">
               <div className="bundle-header">
-                <div className="bundle-title">Plugin bundle (nix)</div>
-                <div className="bundle-subtitle">Skill pack · CLI binary · Config</div>
+                <div className="bundle-title">{t('skillHeader.pluginBundle')}</div>
+                <div className="bundle-subtitle">{t('skillHeader.skillPack')}</div>
               </div>
               <div className="bundle-includes">
-                <span>SKILL.md</span>
-                <span>CLI</span>
-                <span>Config</span>
+                <span>{t('skillHeader.skillMd')}</span>
+                <span>{t('skillHeader.cli')}</span>
+                <span>{t('skillHeader.config')}</span>
               </div>
               {configRequirements ? (
                 <div className="bundle-section">
-                  <div className="bundle-section-title">Config requirements</div>
+                  <div className="bundle-section-title">{t('skillHeader.configRequirements')}</div>
                   <div className="bundle-meta">
                     {configRequirements.requiredEnv?.length ? (
                       <div className="stat">
-                        <strong>Required env</strong>
+                        <strong>{t('skillHeader.requiredEnv')}</strong>
                         <span>{configRequirements.requiredEnv.join(', ')}</span>
                       </div>
                     ) : null}
                     {configRequirements.stateDirs?.length ? (
                       <div className="stat">
-                        <strong>State dirs</strong>
+                        <strong>{t('skillHeader.stateDirs')}</strong>
                         <span>{configRequirements.stateDirs.join(', ')}</span>
                       </div>
                     ) : null}
@@ -313,7 +307,7 @@ export function SkillHeader({
               ) : null}
               {cliHelp ? (
                 <details className="bundle-section bundle-details">
-                  <summary>CLI help (from plugin)</summary>
+                  <summary>{t('skillHeader.cliHelp')}</summary>
                   <pre className="hero-install-code mono">{cliHelp}</pre>
                 </details>
               ) : null}
@@ -324,7 +318,7 @@ export function SkillHeader({
         <div className="skill-tag-row">
           {tagEntries.length === 0 ? (
             <span className="section-subtitle" style={{ margin: 0 }}>
-              No tags yet.
+              {t('skillHeader.noTags')}
             </span>
           ) : (
             tagEntries.map(([tag, versionId]) => (
@@ -362,7 +356,7 @@ export function SkillHeader({
               ))}
             </select>
             <button className="btn" type="submit">
-              Update tag
+              {t('skillHeader.updateTag')}
             </button>
           </form>
         ) : null}
diff --git a/src/components/SkillInstallCard.tsx b/src/components/SkillInstallCard.tsx
index 23a24a4339..2634fdc8e3 100644
--- a/src/components/SkillInstallCard.tsx
+++ b/src/components/SkillInstallCard.tsx
@@ -4,6 +4,7 @@ import {
   PLATFORM_SKILL_LICENSE_SUMMARY,
   PLATFORM_SKILL_LICENSE_URL,
 } from 'clawhub-schema'
+import { useI18n } from '../i18n/useI18n'
 import { formatInstallCommand, formatInstallLabel } from './skillDetailUtils'
 
 type SkillInstallCardProps = {
@@ -12,6 +13,7 @@ type SkillInstallCardProps = {
 }
 
 export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
+  const { t } = useI18n()
   const requirements = clawdis?.requires
   const installSpecs = clawdis?.install ?? []
   const envVars = clawdis?.envVars ?? []
@@ -59,57 +61,57 @@ export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
         {hasRuntimeRequirements ? (
           <div className="skill-panel">
             <h3 className="section-title" style={{ fontSize: '1rem', margin: 0 }}>
-              Runtime requirements
+              {t('skillInstall.runtimeRequirements')}
             </h3>
             <div className="skill-panel-body">
-              {clawdis?.emoji ? <div className="tag">{clawdis.emoji} Clawdis</div> : null}
+              {clawdis?.emoji ? <div className="tag">{clawdis.emoji} {t('skillInstall.clawdis')}</div> : null}
               {osLabels.length ? (
                 <div className="stat">
-                  <strong>OS</strong>
+                  <strong>{t('skillInstall.os')}</strong>
                   <span>{osLabels.join(' · ')}</span>
                 </div>
               ) : null}
               {requirements?.bins?.length ? (
                 <div className="stat">
-                  <strong>Bins</strong>
+                  <strong>{t('skillInstall.bins')}</strong>
                   <span>{requirements.bins.join(', ')}</span>
                 </div>
               ) : null}
               {requirements?.anyBins?.length ? (
                 <div className="stat">
-                  <strong>Any bin</strong>
+                  <strong>{t('skillInstall.anyBin')}</strong>
                   <span>{requirements.anyBins.join(', ')}</span>
                 </div>
               ) : null}
               {requirements?.env?.length ? (
                 <div className="stat">
-                  <strong>Env</strong>
+                  <strong>{t('skillInstall.env')}</strong>
                   <span>{requirements.env.join(', ')}</span>
                 </div>
               ) : null}
               {requirements?.config?.length ? (
                 <div className="stat">
-                  <strong>Config</strong>
+                  <strong>{t('skillInstall.config')}</strong>
                   <span>{requirements.config.join(', ')}</span>
                 </div>
               ) : null}
               {clawdis?.primaryEnv ? (
                 <div className="stat">
-                  <strong>Primary env</strong>
+                  <strong>{t('skillInstall.primaryEnv')}</strong>
                   <span>{clawdis.primaryEnv}</span>
                 </div>
               ) : null}
               {envVars.length > 0 ? (
                 <div className="stat">
-                  <strong>Environment variables</strong>
+                  <strong>{t('skillInstall.environmentVariables')}</strong>
                   <div style={{ display: 'flex', flexDirection: 'column', gap: '0.25rem', marginTop: '0.25rem' }}>
                     {envVars.map((env, index) => (
                       <div key={`${env.name}-${index}`} style={{ display: 'flex', alignItems: 'baseline', gap: '0.5rem' }}>
                         <code style={{ fontSize: '0.85rem' }}>{env.name}</code>
                         {env.required === false ? (
-                          <span style={{ color: 'var(--ink-soft)', fontSize: '0.75rem' }}>optional</span>
+                          <span style={{ color: 'var(--ink-soft)', fontSize: '0.75rem' }}>{t('skillInstall.optional')}</span>
                         ) : env.required === true ? (
-                          <span style={{ color: 'var(--ink-accent)', fontSize: '0.75rem' }}>required</span>
+                          <span style={{ color: 'var(--ink-accent)', fontSize: '0.75rem' }}>{t('skillInstall.required')}</span>
                         ) : null}
                         {env.description ? (
                           <span style={{ color: 'var(--ink-soft)', fontSize: '0.8rem' }}>— {env.description}</span>
@@ -125,7 +127,7 @@ export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
         {hasDependencies ? (
           <div className="skill-panel">
             <h3 className="section-title" style={{ fontSize: '1rem', margin: 0 }}>
-              Dependencies
+              {t('skillInstall.dependencies')}
             </h3>
             <div className="skill-panel-body">
               {dependencies.map((dep, index) => (
@@ -142,7 +144,7 @@ export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
                     ) : null}
                     {dep.repository && dep.repository !== dep.url ? (
                       <div style={{ fontSize: '0.8rem' }}>
-                        <a href={dep.repository} target="_blank" rel="noopener noreferrer">Source</a>
+                        <a href={dep.repository} target="_blank" rel="noopener noreferrer">{t('skillInstall.source')}</a>
                       </div>
                     ) : null}
                   </div>
@@ -154,7 +156,7 @@ export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
         {hasInstallSpecs ? (
           <div className="skill-panel">
             <h3 className="section-title" style={{ fontSize: '1rem', margin: 0 }}>
-              Install
+              {t('skillInstall.install')}
             </h3>
             <div className="skill-panel-body">
               {installSpecs.map((spec, index) => {
@@ -165,7 +167,7 @@ export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
                       <strong>{spec.label ?? formatInstallLabel(spec)}</strong>
                       {spec.bins?.length ? (
                         <div style={{ color: 'var(--ink-soft)', fontSize: '0.85rem' }}>
-                          Bins: {spec.bins.join(', ')}
+                          {t('skillInstall.binsLabel', { bins: spec.bins.join(', ') })}
                         </div>
                       ) : null}
                       {command ? <code>{command}</code> : null}
@@ -179,24 +181,24 @@ export function SkillInstallCard({ clawdis, osLabels }: SkillInstallCardProps) {
         {hasLinks ? (
           <div className="skill-panel">
             <h3 className="section-title" style={{ fontSize: '1rem', margin: 0 }}>
-              Links
+              {t('skillInstall.links')}
             </h3>
             <div className="skill-panel-body">
               {links?.homepage ? (
                 <div className="stat">
-                  <strong>Homepage</strong>
+                  <strong>{t('skillInstall.homepage')}</strong>
                   <a href={links.homepage} target="_blank" rel="noopener noreferrer">{links.homepage}</a>
                 </div>
               ) : null}
               {links?.repository ? (
                 <div className="stat">
-                  <strong>Repository</strong>
+                  <strong>{t('skillInstall.repository')}</strong>
                   <a href={links.repository} target="_blank" rel="noopener noreferrer">{links.repository}</a>
                 </div>
               ) : null}
               {links?.documentation ? (
                 <div className="stat">
-                  <strong>Docs</strong>
+                  <strong>{t('skillInstall.docs')}</strong>
                   <a href={links.documentation} target="_blank" rel="noopener noreferrer">{links.documentation}</a>
                 </div>
               ) : null}
diff --git a/src/components/SkillReportDialog.tsx b/src/components/SkillReportDialog.tsx
index d3bd8e1467..e83fb7a290 100644
--- a/src/components/SkillReportDialog.tsx
+++ b/src/components/SkillReportDialog.tsx
@@ -1,3 +1,5 @@
+import { useI18n } from '../i18n/useI18n'
+
 type SkillReportDialogProps = {
   isOpen: boolean
   isSubmitting: boolean
@@ -17,16 +19,17 @@ export function SkillReportDialog({
   onCancel,
   onSubmit,
 }: SkillReportDialogProps) {
+  const { t } = useI18n()
   if (!isOpen) return null
 
   return (
     <div className="report-dialog-backdrop">
       <div className="report-dialog" role="dialog" aria-modal="true" aria-labelledby="report-title">
         <h2 id="report-title" className="section-title" style={{ margin: 0, fontSize: '1.1rem' }}>
-          Report skill
+          {t('skillReport.title')}
         </h2>
         <p className="section-subtitle" style={{ margin: 0 }}>
-          Describe the issue so moderators can review it quickly.
+          {t('skillReport.subtitle')}
         </p>
         <form
           className="report-dialog-form"
@@ -37,8 +40,8 @@ export function SkillReportDialog({
         >
           <textarea
             className="report-dialog-textarea"
-            aria-label="Report reason"
-            placeholder="What should moderators know?"
+            aria-label={t('skillReport.ariaLabel')}
+            placeholder={t('skillReport.placeholder')}
             value={reportReason}
             onChange={(event) => onReasonChange(event.target.value)}
             rows={5}
@@ -54,10 +57,10 @@ export function SkillReportDialog({
               }}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('skillReport.cancel')}
             </button>
             <button type="submit" className="btn" disabled={isSubmitting}>
-              {isSubmitting ? 'Submitting…' : 'Submit report'}
+              {isSubmitting ? t('skillReport.submitting') : t('skillReport.submit')}
             </button>
           </div>
         </form>
diff --git a/src/components/SkillSecurityScanResults.tsx b/src/components/SkillSecurityScanResults.tsx
index ee3e40e610..a95061bc12 100644
--- a/src/components/SkillSecurityScanResults.tsx
+++ b/src/components/SkillSecurityScanResults.tsx
@@ -1,4 +1,6 @@
 import { useState } from 'react'
+import type { TranslationKey } from '../i18n'
+import { useI18n } from '../i18n/useI18n'
 
 type LlmAnalysisDimension = {
   name: string
@@ -83,23 +85,23 @@ function OpenClawIcon({ className }: { className?: string }) {
   )
 }
 
-function getScanStatusInfo(status: string) {
+function getScanStatusInfo(status: string, t: (key: TranslationKey, params?: Record<string, string | number>) => string) {
   switch (status.toLowerCase()) {
     case 'benign':
     case 'clean':
-      return { label: 'Benign', className: 'scan-status-clean' }
+      return { label: t('skillSecurity.benign'), className: 'scan-status-clean' }
     case 'malicious':
-      return { label: 'Malicious', className: 'scan-status-malicious' }
+      return { label: t('skillSecurity.malicious'), className: 'scan-status-malicious' }
     case 'suspicious':
-      return { label: 'Suspicious', className: 'scan-status-suspicious' }
+      return { label: t('skillSecurity.suspicious'), className: 'scan-status-suspicious' }
     case 'loading':
-      return { label: 'Loading...', className: 'scan-status-pending' }
+      return { label: t('skillSecurity.loading'), className: 'scan-status-pending' }
     case 'pending':
     case 'not_found':
-      return { label: 'Pending', className: 'scan-status-pending' }
+      return { label: t('skillSecurity.pending'), className: 'scan-status-pending' }
     case 'error':
     case 'failed':
-      return { label: 'Error', className: 'scan-status-error' }
+      return { label: t('skillSecurity.error'), className: 'scan-status-error' }
     default:
       return { label: status, className: 'scan-status-unknown' }
   }
@@ -119,6 +121,7 @@ function getDimensionIcon(rating: string) {
 }
 
 function LlmAnalysisDetail({ analysis }: { analysis: LlmAnalysis }) {
+  const { t } = useI18n()
   const verdict = analysis.verdict ?? analysis.status
   const [isOpen, setIsOpen] = useState(false)
 
@@ -161,7 +164,7 @@ function LlmAnalysisDetail({ analysis }: { analysis: LlmAnalysis }) {
         ) : null}
         {analysis.findings ? (
           <div className="scan-findings-section">
-            <div className="scan-findings-title">Scan Findings in Context</div>
+            <div className="scan-findings-title">{t('skillSecurity.scanFindings')}</div>
             {(() => {
               const counts = new Map<string, number>()
               return analysis.findings.split('\n').map((line) => {
@@ -180,10 +183,10 @@ function LlmAnalysisDetail({ analysis }: { analysis: LlmAnalysis }) {
           <div className={`analysis-guidance ${guidanceClass}`}>
             <div className="analysis-guidance-label">
               {verdict === 'malicious'
-                ? 'Do not install this skill'
+                ? t('skillSecurity.doNotInstall')
                 : verdict === 'suspicious'
-                  ? 'What to consider before installing'
-                  : 'Assessment'}
+                  ? t('skillSecurity.whatToConsider')
+                  : t('skillSecurity.assessment')}
             </div>
             {analysis.guidance}
           </div>
@@ -199,16 +202,17 @@ export function SecurityScanResults({
   llmAnalysis,
   variant = 'panel',
 }: SecurityScanResultsProps) {
+  const { t } = useI18n()
   if (!sha256hash && !llmAnalysis) return null
 
   const vtStatus = vtAnalysis?.status ?? 'pending'
   const vtUrl = sha256hash ? `https://www.virustotal.com/gui/file/${sha256hash}` : null
-  const vtStatusInfo = getScanStatusInfo(vtStatus)
+  const vtStatusInfo = getScanStatusInfo(vtStatus, t)
   const isCodeInsight = vtAnalysis?.source === 'code_insight'
   const aiAnalysis = vtAnalysis?.analysis
 
   const llmVerdict = llmAnalysis?.verdict ?? llmAnalysis?.status
-  const llmStatusInfo = llmVerdict ? getScanStatusInfo(llmVerdict) : null
+  const llmStatusInfo = llmVerdict ? getScanStatusInfo(llmVerdict, t) : null
 
   if (variant === 'badge') {
     return (
@@ -242,7 +246,7 @@ export function SecurityScanResults({
 
   return (
     <div className="scan-results-panel">
-      <div className="scan-results-title">Security Scan</div>
+      <div className="scan-results-title">{t('skillSecurity.title')}</div>
       <div className="scan-results-list">
         {sha256hash ? (
           <div className="scan-result-row">
@@ -258,14 +262,14 @@ export function SecurityScanResults({
                 rel="noopener noreferrer"
                 className="scan-result-link"
               >
-                View report →
+                {t('skillSecurity.viewReport')}
               </a>
             ) : null}
           </div>
         ) : null}
         {isCodeInsight && aiAnalysis && (vtStatus === 'malicious' || vtStatus === 'suspicious') ? (
           <div className={`code-insight-analysis ${vtStatus}`}>
-            <div className="code-insight-label">Code Insight</div>
+            <div className="code-insight-label">{t('skillSecurity.codeInsight')}</div>
             <p className="code-insight-text">{aiAnalysis}</p>
           </div>
         ) : null}
@@ -277,7 +281,7 @@ export function SecurityScanResults({
             </div>
             <div className={`scan-result-status ${llmStatusInfo.className}`}>{llmStatusInfo.label}</div>
             {llmAnalysis.confidence ? (
-              <span className="scan-result-confidence">{llmAnalysis.confidence} confidence</span>
+              <span className="scan-result-confidence">{t('skillSecurity.confidence', { confidence: llmAnalysis.confidence })}</span>
             ) : null}
           </div>
         ) : null}
diff --git a/src/components/SkillVersionsPanel.tsx b/src/components/SkillVersionsPanel.tsx
index ae8323c32b..1a0f5b4efe 100644
--- a/src/components/SkillVersionsPanel.tsx
+++ b/src/components/SkillVersionsPanel.tsx
@@ -1,4 +1,5 @@
 import type { Doc } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n/useI18n'
 import { type LlmAnalysis, SecurityScanResults } from './SkillSecurityScanResults'
 
 type SkillVersionsPanelProps = {
@@ -8,16 +9,17 @@ type SkillVersionsPanelProps = {
 }
 
 export function SkillVersionsPanel({ versions, nixPlugin, skillSlug }: SkillVersionsPanelProps) {
+  const { t } = useI18n()
   return (
     <div className="tab-body">
       <div>
         <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-          Versions
+          {t('skillVersions.title')}
         </h2>
         <p className="section-subtitle" style={{ margin: 0 }}>
           {nixPlugin
-            ? 'Review release history and changelog.'
-            : 'Download older releases or scan the changelog.'}
+            ? t('skillVersions.subtitlePlugin')
+            : t('skillVersions.subtitleNonPlugin')}
         </p>
       </div>
       <div className="version-scroll">
@@ -28,7 +30,7 @@ export function SkillVersionsPanel({ versions, nixPlugin, skillSlug }: SkillVers
                 <div>
                   v{version.version} · {new Date(version.createdAt).toLocaleDateString()}
                   {version.changelogSource === 'auto' ? (
-                    <span style={{ color: 'var(--ink-soft)' }}> · auto</span>
+                    <span style={{ color: 'var(--ink-soft)' }}> · {t('skillVersions.auto')}</span>
                   ) : null}
                 </div>
                 <div style={{ color: '#5c554e', whiteSpace: 'pre-wrap' }}>{version.changelog}</div>
@@ -49,7 +51,7 @@ export function SkillVersionsPanel({ versions, nixPlugin, skillSlug }: SkillVers
                     className="btn version-zip"
                     href={`${import.meta.env.VITE_CONVEX_SITE_URL}/api/v1/download?slug=${skillSlug}&version=${version.version}`}
                   >
-                    Zip
+                    {t('skillVersions.zip')}
                   </a>
                 </div>
               ) : null}
diff --git a/src/components/SoulDetailPage.tsx b/src/components/SoulDetailPage.tsx
index 90c6866cae..73cfae4693 100644
--- a/src/components/SoulDetailPage.tsx
+++ b/src/components/SoulDetailPage.tsx
@@ -8,6 +8,7 @@ import { SoulStatsTripletLine } from './SoulStats'
 import type { PublicSoul, PublicUser } from '../lib/publicUser'
 import { isModerator } from '../lib/roles'
 import { useAuthStatus } from '../lib/useAuthStatus'
+import { useI18n } from '../i18n/useI18n'
 import { stripFrontmatter } from './skillDetailUtils'
 
 type SoulDetailPageProps = {
@@ -22,6 +23,7 @@ type SoulBySlugResult = {
 
 export function SoulDetailPage({ slug }: SoulDetailPageProps) {
   const { isAuthenticated, me } = useAuthStatus()
+  const { t } = useI18n()
   const result = useQuery(api.souls.getBySlug, { slug }) as SoulBySlugResult | undefined
   const toggleStar = useMutation(api.soulStars.toggle)
   const addComment = useMutation(api.soulComments.add)
@@ -87,7 +89,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
     return (
       <main className="section">
         <div className="card">
-          <div className="loading-indicator">Loading soul…</div>
+          <div className="loading-indicator">{t('soulDetail.loading')}</div>
         </div>
       </main>
     )
@@ -96,7 +98,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
   if (result === null || !soul) {
     return (
       <main className="section">
-        <div className="card">Soul not found.</div>
+        <div className="card">{t('soulDetail.notFound')}</div>
       </main>
     )
   }
@@ -113,7 +115,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
               <h1 className="section-title" style={{ margin: 0 }}>
                 {soul.displayName}
               </h1>
-              <p className="section-subtitle">{soul.summary ?? 'No summary provided.'}</p>
+              <p className="section-subtitle">{soul.summary ?? t('soulDetail.noSummary')}</p>
               <div className="stat">
                 <SoulStatsTripletLine stats={soul.stats} versionSuffix="versions" />
               </div>
@@ -137,15 +139,15 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
             </div>
             <div className="skill-hero-cta">
               <div className="skill-version-pill">
-                <span className="skill-version-label">Current version</span>
+                <span className="skill-version-label">{t('soulDetail.currentVersion')}</span>
                 <strong>v{latestVersion?.version ?? '—'}</strong>
               </div>
               <a
                 className="btn btn-primary"
                 href={`${downloadBase}?path=SOUL.md`}
-                aria-label="Download SOUL.md"
+                aria-label={t('soulDetail.downloadSoul')}
               >
-                Download SOUL.md
+                {t('soulDetail.downloadSoul')}
               </a>
             </div>
           </div>
@@ -156,16 +158,16 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
             {readmeContent ? (
               <ReactMarkdown remarkPlugins={[remarkGfm]}>{readmeContent}</ReactMarkdown>
             ) : readmeError ? (
-              <div className="stat">Failed to load SOUL.md: {readmeError}</div>
+              <div className="stat">{t('soulDetail.loadFailed', { error: readmeError ?? '' })}</div>
             ) : (
-              <div className="loading-indicator">Loading SOUL.md…</div>
+              <div className="loading-indicator">{t('soulDetail.loadingSoul')}</div>
             )}
           </div>
         </div>
 
         <div className="card">
           <h2 className="section-title" style={{ fontSize: '1.2rem', marginBottom: 8 }}>
-            Versions
+            {t('soulDetail.versions')}
           </h2>
           <div className="version-scroll">
             <div className="version-list">
@@ -175,7 +177,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
                     <div>
                       v{version.version} · {new Date(version.createdAt).toLocaleDateString()}
                       {version.changelogSource === 'auto' ? (
-                        <span style={{ color: 'var(--ink-soft)' }}> · auto</span>
+                        <span style={{ color: 'var(--ink-soft)' }}> · {t('soulDetail.auto')}</span>
                       ) : null}
                     </div>
                     <div style={{ color: '#5c554e', whiteSpace: 'pre-wrap' }}>
@@ -189,7 +191,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
                         version.version,
                       )}`}
                     >
-                      SOUL.md
+                      {t('soulDetail.soulMd')}
                     </a>
                   </div>
                 </div>
@@ -200,7 +202,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
 
         <div className="card">
           <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-            Comments
+            {t('soulDetail.comments')}
           </h2>
           {isAuthenticated ? (
             <form
@@ -218,18 +220,18 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
                 rows={4}
                 value={comment}
                 onChange={(event) => setComment(event.target.value)}
-                placeholder="Leave a note…"
+                placeholder={t('soulDetail.placeholder')}
               />
               <button className="btn comment-submit" type="submit">
-                Post comment
+                {t('soulDetail.postComment')}
               </button>
             </form>
           ) : (
-            <p className="section-subtitle">Sign in to comment.</p>
+            <p className="section-subtitle">{t('soulDetail.signInToComment')}</p>
           )}
           <div style={{ display: 'grid', gap: 12, marginTop: 16 }}>
             {(comments ?? []).length === 0 ? (
-              <div className="stat">No comments yet.</div>
+              <div className="stat">{t('soulDetail.noComments')}</div>
             ) : (
               (comments ?? []).map((entry) => (
                 <div key={entry.comment._id} className="comment-item">
@@ -243,7 +245,7 @@ export function SoulDetailPage({ slug }: SoulDetailPageProps) {
                       type="button"
                       onClick={() => void removeComment({ commentId: entry.comment._id })}
                     >
-                      Delete
+                      {t('soulDetail.delete')}
                     </button>
                   ) : null}
                 </div>
diff --git a/src/components/UserBadge.tsx b/src/components/UserBadge.tsx
index c82cc9574f..7f649e0438 100644
--- a/src/components/UserBadge.tsx
+++ b/src/components/UserBadge.tsx
@@ -1,4 +1,5 @@
 import type { PublicUser } from '../lib/publicUser'
+import { useI18n } from '../i18n/useI18n'
 
 type UserBadgeProps = {
   user: PublicUser | null | undefined
@@ -17,9 +18,10 @@ export function UserBadge({
   link = true,
   showName = false,
 }: UserBadgeProps) {
+  const { t } = useI18n()
   const handle = user?.handle ?? user?.name ?? fallbackHandle ?? null
   const href = user?.handle ? `/u/${encodeURIComponent(user.handle)}` : null
-  const label = handle ? `@${handle}` : 'user'
+  const label = handle ? `@${handle}` : t('userBadge.user')
   const image = user?.image ?? null
   const displayName = user?.displayName?.trim() || null
   const hasUsefulName =
diff --git a/src/i18n/__tests__/locale-parity.test.ts b/src/i18n/__tests__/locale-parity.test.ts
new file mode 100644
index 0000000000..80fb7de7ed
--- /dev/null
+++ b/src/i18n/__tests__/locale-parity.test.ts
@@ -0,0 +1,63 @@
+import { describe, expect, it } from "vitest";
+import { en } from "../locales/en";
+import { zhCN } from "../locales/zh-CN";
+import type { TranslationMap } from "../types";
+
+/** Recursively extract all dot-path keys from a translation object. */
+function flattenKeys(obj: TranslationMap, prefix = ""): string[] {
+  const keys: string[] = [];
+  for (const [k, v] of Object.entries(obj)) {
+    const path = prefix ? `${prefix}.${k}` : k;
+    if (typeof v === "string") {
+      keys.push(path);
+    } else if (typeof v === "object" && v !== null) {
+      keys.push(...flattenKeys(v as TranslationMap, path));
+    }
+  }
+  return keys.sort();
+}
+
+describe("locale parity", () => {
+  const enKeys = flattenKeys(en);
+  const zhKeys = flattenKeys(zhCN);
+
+  it("en and zh-CN should have the same number of keys", () => {
+    expect(enKeys.length).toBe(zhKeys.length);
+  });
+
+  it("zh-CN should not be missing any keys from en", () => {
+    const missing = enKeys.filter((k) => !zhKeys.includes(k));
+    if (missing.length > 0) {
+      throw new Error(
+        `zh-CN is missing ${missing.length} key(s) from en:\n  ${missing.join("\n  ")}`,
+      );
+    }
+  });
+
+  it("zh-CN should not have extra keys not in en", () => {
+    const extra = zhKeys.filter((k) => !enKeys.includes(k));
+    if (extra.length > 0) {
+      throw new Error(
+        `zh-CN has ${extra.length} extra key(s) not in en:\n  ${extra.join("\n  ")}`,
+      );
+    }
+  });
+
+  it("en keys should exactly match zh-CN keys", () => {
+    expect(enKeys).toEqual(zhKeys);
+  });
+
+  it("all leaf values in en should be non-empty strings", () => {
+    const empty = enKeys.filter((k) => {
+      const parts = k.split(".");
+      let current: unknown = en;
+      for (const part of parts) {
+        current = (current as Record<string, unknown>)[part];
+      }
+      return typeof current !== "string" || current.trim() === "";
+    });
+    if (empty.length > 0) {
+      throw new Error(`en has ${empty.length} empty value(s):\n  ${empty.join("\n  ")}`);
+    }
+  });
+});
diff --git a/src/i18n/index.ts b/src/i18n/index.ts
new file mode 100644
index 0000000000..88c3b60b4c
--- /dev/null
+++ b/src/i18n/index.ts
@@ -0,0 +1,3 @@
+export { i18n, t, type TranslationKey } from "./translate";
+export { useI18n } from "./useI18n";
+export type { Locale, TranslationMap, FlattenKeys } from "./types";
diff --git a/src/i18n/locales/en.ts b/src/i18n/locales/en.ts
new file mode 100644
index 0000000000..4c12577474
--- /dev/null
+++ b/src/i18n/locales/en.ts
@@ -0,0 +1,544 @@
+export const en = {
+  header: {
+    skills: "Skills",
+    souls: "Souls",
+    upload: "Upload",
+    import: "Import",
+    search: "Search",
+    stars: "Stars",
+    management: "Management",
+    dashboard: "Dashboard",
+    settings: "Settings",
+    signOut: "Sign out",
+    signIn: "Sign in",
+    withGitHub: "with GitHub",
+    openMenu: "Open menu",
+    system: "System",
+    light: "Light",
+    dark: "Dark",
+    systemTheme: "System theme",
+    lightTheme: "Light theme",
+    darkTheme: "Dark theme",
+    language: "Language",
+    userAvatar: "User avatar",
+  },
+  footer: {
+    an: "An",
+    openClaw: "OpenClaw",
+    project: "project",
+    deployedOn: "Deployed on",
+    poweredBy: "Powered by",
+    openSourceMIT: "Open source (MIT)",
+  },
+  home: {
+    skills: {
+      badge: "Lobster-light. Agent-right.",
+      title: "ClawHub, the skill dock for sharp agents.",
+      subtitle:
+        "Upload AgentSkills bundles, version them like npm, and make them searchable with vectors. No gatekeeping, just signal.",
+      publishSkill: "Publish a skill",
+      browseSkills: "Browse skills",
+      searchStat: "Search skills. Versioned, rollback-ready.",
+      highlightedSkills: "Highlighted skills",
+      highlightedSubtitle:
+        "Curated signal — highlighted for quick trust.",
+      noHighlighted: "No highlighted skills yet.",
+      freshBundle: "A fresh skill bundle.",
+      popularSkills: "Popular skills",
+      popularSubtitle: "Most-downloaded, non-suspicious picks.",
+      noSkills: "No skills yet. Be the first.",
+      agentReady: "Agent-ready skill pack.",
+      seeAllSkills: "See all skills",
+    },
+    souls: {
+      badge: "SOUL.md, shared.",
+      title: "SoulHub, where system lore lives.",
+      subtitle:
+        "Share SOUL.md bundles, version them like docs, and keep personal system lore in one public place.",
+      publishSoul: "Publish a soul",
+      browseSouls: "Browse souls",
+      searchPlaceholder: "Search souls, prompts, or lore",
+      searchStat: "Search souls. Versioned, readable, easy to remix.",
+      latestSouls: "Latest souls",
+      latestSubtitle: "Newest SOUL.md bundles across the hub.",
+      noSouls: "No souls yet. Be the first.",
+      soulBundle: "A SOUL.md bundle.",
+      seeAllSouls: "See all souls",
+    },
+  },
+  skillsIndex: {
+    title: "Skills",
+    loading: "Loading skills\u2026",
+    browseLibrary: "Browse the skill library.",
+  },
+  skillsToolbar: {
+    filterPlaceholder: "Filter by name, slug, or summary\u2026",
+    highlighted: "Highlighted",
+    hideSuspicious: "Hide suspicious",
+    relevance: "Relevance",
+    newest: "Newest",
+    recentlyUpdated: "Recently updated",
+    downloads: "Downloads",
+    installs: "Installs",
+    stars: "Stars",
+    name: "Name",
+    sortDirection: "Sort direction",
+    list: "List",
+    cards: "Cards",
+  },
+  skillsResults: {
+    loading: "Loading skills\u2026",
+    noMatch: "No skills match that filter.",
+    pluginBundle: "Plugin bundle (nix)",
+    agentReady: "Agent-ready skill pack.",
+    noSummary: "No summary provided.",
+    loadingMore: "Loading more\u2026",
+    scrollToLoad: "Scroll to load more",
+    loadMore: "Load more",
+    loadingEllipsis: "Loading\u2026",
+  },
+  stars: {
+    signInRequired: "Sign in to see your highlights.",
+    title: "Your highlights",
+    subtitle: "Skills you've starred for quick access.",
+    noStars: "No stars yet.",
+    unstar: "Unstar",
+  },
+  dashboard: {
+    signInRequired: "Sign in to access your dashboard.",
+    mySkills: "My Skills",
+    uploadNew: "Upload New Skill",
+    noSkillsTitle: "No skills yet",
+    noSkillsText:
+      "Upload your first skill to share it with the community.",
+    uploadSkill: "Upload a Skill",
+    scanning: "Scanning",
+    newVersion: "New Version",
+    view: "View",
+  },
+  settings: {
+    signInRequired: "Sign in to access settings.",
+    title: "Settings",
+    displayName: "Display name",
+    bio: "Bio",
+    bioPlaceholder: "Tell people what you're building.",
+    save: "Save",
+    saved: "Saved.",
+    apiTokens: "API tokens",
+    apiTokensSubtitle:
+      "Use these tokens for the `clawhub` CLI. Tokens are shown once on creation.",
+    label: "Label",
+    cliToken: "CLI token",
+    createToken: "Create token",
+    copyTokenNow: "Copy this token now:",
+    created: "Created",
+    used: "Used",
+    revoked: "Revoked",
+    revoke: "Revoke",
+    noTokens: "No tokens yet.",
+    dangerZone: "Danger zone",
+    dangerText:
+      "Delete your account permanently. This cannot be undone. Published skills remain public.",
+    deleteAccount: "Delete account",
+  },
+  upload: {
+    signInRequired: "Sign in to upload a {contentLabel}.",
+    publishTitle: "Publish a {contentLabel}",
+    dropInstruction:
+      "Drop a folder with {requiredFileLabel} and text files. We will handle the rest.",
+    slug: "Slug",
+    slugPlaceholder: "{contentLabel}-name",
+    displayName: "Display name",
+    displayNamePlaceholder: "My {contentLabel}",
+    version: "Version",
+    versionPlaceholder: "1.0.0",
+    tags: "Tags",
+    tagsPlaceholder: "latest, stable",
+    dropFolder: "Drop a folder",
+    filesCount: "{count} files \u00b7 {sizeLabel}",
+    flattenHint:
+      "We keep folder paths and flatten the outer wrapper automatically.",
+    chooseFolder: "Choose folder",
+    noFiles: "No files selected.",
+    ignoredJunk: "Ignored {count} macOS junk file{s} ({names})",
+    validation: "Validation",
+    allChecksPassed: "All checks passed.",
+    slugRequired: "Slug is required.",
+    slugFormat: "Slug must be lowercase and use dashes only.",
+    displayNameRequired: "Display name is required.",
+    versionFormat: "Version must be valid semver (e.g. 1.0.0).",
+    tagRequired: "At least one tag is required.",
+    addFile: "Add at least one file.",
+    requiredFile: "{requiredFileLabel} is required.",
+    removeNonText: "Remove non-text files: {files}",
+    totalSizeExceeds: "Total file size exceeds 50MB.",
+    changelog: "Changelog",
+    changelogPlaceholder: "Describe what changed in this {contentLabel}...",
+    generatingChangelog: "Generating changelog\u2026",
+    changelogError: "Could not auto-generate changelog.",
+    changelogGenerated: "Auto-generated changelog (edit as needed).",
+    fixValidation: "Fix validation issues to continue.",
+    publishButton: "Publish {contentLabel}",
+    uploadingFiles: "Uploading files\u2026",
+    publishing: "Publishing\u2026",
+    totalSizeError: "Total size exceeds 50MB per version.",
+  },
+  import: {
+    signInRequired: "Sign in to import and publish skills.",
+    loading: "Loading\u2026",
+    kicker: "GitHub import",
+    title: "Import from GitHub",
+    subtitle: "Public repos only. Detects SKILL.md automatically.",
+    publicOnly: "Public only",
+    commitPinned: "Commit pinned",
+    githubUrl: "GitHub URL",
+    repoHint: "Repo, tree path, or blob",
+    placeholder: "https://github.com/owner/repo",
+    detect: "Detect",
+    foundSkills: "Found {count} skills. Pick one.",
+    previewFailed: "Preview failed",
+    pickSkill: "Pick a skill",
+    repoRoot: "(repo root)",
+    readyToImport: "Ready to import.",
+    selectReferenced: "Select referenced",
+    selectAll: "Select all",
+    clear: "Clear",
+    selected: "Selected: {selectedCount}/{totalCount} \u00b7 {size}",
+    importPublish: "Import + publish",
+    importing: "Importing\u2026",
+    imported: "Imported.",
+    importFailed: "Import failed",
+    redirectFails: "If redirect fails, copy this token:",
+  },
+  management: {
+    accessRestricted: "Management only.",
+    loading: "Loading management console\u2026",
+    title: "Management console",
+    subtitle: "Moderation, curation, and ownership tools.",
+    reportedSkills: "Reported skills",
+    searchReported: "Search reported skills",
+    filter: "Filter",
+    noMatchingReports: "No matching reports.",
+    noReports: "No reports yet.",
+    showingCount: "Showing {count} of {total}",
+    reports: "report{s}",
+    lastTime: "last {time}",
+    noReportReasons: "No report reasons yet.",
+    restore: "Restore",
+    hide: "Hide",
+    hardDelete: "Hard delete",
+    skillTools: "Skill tools",
+    managing: "Managing \u201c{slug}\u201d \u00b7",
+    clearSelection: "Clear selection",
+    useManageButton:
+      "Use the Manage button on a skill to open tooling here.",
+    loadingSkill: "Loading skill\u2026",
+    noSkillFound: "No skill found for \u201c{slug}\u201d.",
+    duplicateOf: "duplicate of",
+    owner: "owner",
+    setDuplicate: "Set duplicate",
+    changeOwner: "Change owner",
+    view: "View",
+    unhighlight: "Unhighlight",
+    highlight: "Highlight",
+    banUser: "Ban user",
+    removeOfficial: "Remove official",
+    markOfficial: "Mark official",
+    removeDeprecated: "Remove deprecated",
+    markDeprecated: "Mark deprecated",
+    duplicateCandidates: "Duplicate candidates",
+    noDuplicates: "No duplicate candidates.",
+    markDuplicate: "Mark duplicate",
+    recentPushes: "Recent pushes",
+    noRecentVersions: "No recent versions.",
+    users: "Users",
+    searchUsers: "Search users",
+    noMatchingUsers: "No matching users.",
+    noUsers: "No users yet.",
+    loadingUsers: "Loading users\u2026",
+    user: "User",
+    moderator: "Moderator",
+    admin: "Admin",
+    banConfirm: "Ban @{handle} and delete their skills?",
+    deleteTelemetryConfirm: "Delete all telemetry data?",
+    banOnlyConfirm: "Ban @{handle}?",
+    unknownSkill: "Unknown skill",
+  },
+  skillDetail: {
+    loading: "Loading skill\u2026",
+    notFound: "Skill not found.",
+    reportError: "Unable to submit report. Please try again.",
+    reportReasonRequired: "Report reason required.",
+    reportSubmitted: "Thanks \u2014 your report has been submitted.",
+    alreadyReported: "You have already reported this skill.",
+    autoHidden: "Auto-hidden after 4+ unique reports.",
+    removedFromView: "Removed from public view.",
+    hiddenFromView: "Hidden from public view.",
+    tagRemoved: "Removed",
+    tagAutoHidden: "Auto-hidden",
+    tagHidden: "Hidden",
+  },
+  skillHeader: {
+    scanInProgress: "Security scan in progress",
+    scanDescription:
+      "Your skill is being scanned by VirusTotal. It will be visible to others once the scan completes. This usually takes up to 5 minutes \u2014 grab a coffee or exfoliate your shell while you wait.",
+    blockedTitle: "Skill blocked \u2014 malicious content detected",
+    blockedDescription:
+      "ClawHub Security flagged this skill as malicious. Downloads are disabled. Review the scan results below.",
+    suspiciousTitle:
+      "Skill flagged \u2014 suspicious patterns detected",
+    suspiciousDescription:
+      "ClawHub Security flagged this skill as suspicious. Review the scan results before using.",
+    appealText:
+      "If you believe this skill has been incorrectly flagged, please submit an issue on GitHub and we\u2019ll break down why it was flagged and what you can do.",
+    removedTitle: "Skill removed by moderator",
+    removedDescription:
+      "This skill has been removed and is not visible to others.",
+    hiddenTitle: "Skill hidden",
+    hiddenDescription:
+      "This skill is currently hidden and not visible to others.",
+    pluginBundle: "Plugin bundle (nix)",
+    noSummary: "No summary provided.",
+    bundleNote:
+      "Bundles the skill pack, CLI binary, and config requirements in one Nix install.",
+    currentInstalls: "current installs",
+    allTimeInstalls: "all-time installs",
+    noTags: "No tags yet.",
+    latest: "Latest",
+    updateTag: "Update tag",
+    downloadZip: "Download zip",
+    currentVersion: "Current version",
+    skillPack: "Skill pack \u00b7 CLI binary \u00b7 Config",
+    skillMd: "SKILL.md",
+    cli: "CLI",
+    config: "Config",
+    configRequirements: "Config requirements",
+    requiredEnv: "Required env",
+    stateDirs: "State dirs",
+    cliHelp: "CLI help (from plugin)",
+    unstarSkill: "Unstar skill",
+    starSkill: "Star skill",
+    report: "Report",
+    manage: "Manage",
+    securityDisclaimer:
+      "Like a lobster shell, security has layers \u2014 review code before you run it.",
+    canonical: "canonical:",
+  },
+  skillTabs: {
+    files: "Files",
+    compare: "Compare",
+    versions: "Versions",
+    loadingFileViewer: "Loading file viewer\u2026",
+    loadingDiffViewer: "Loading diff viewer\u2026",
+  },
+  skillFiles: {
+    skillMd: "SKILL.md",
+    loading: "Loading\u2026",
+    loadFailed: "Failed to load SKILL.md: {error}",
+    files: "Files",
+    totalCount: "{count} total",
+    noFiles: "No files available.",
+    selectFile: "Select a file",
+    selectFilePreview: "Select a file to preview.",
+    fileLoadFailed: "Failed to load file: {error}",
+  },
+  skillDiff: {
+    title: "Compare versions",
+    subtitle: "Inline or side-by-side diff for any file.",
+    diffLayout: "Diff layout",
+    sideBySide: "Side-by-side",
+    inline: "Inline",
+    left: "Left",
+    right: "Right",
+    selectVersion: "Select version",
+    swap: "Swap",
+    leftRight: "Left {leftLabel} \u2022 Right {rightLabel}",
+    needTwoVersions: "Need at least 2 versions.",
+    noFilesToCompare: "No files to compare.",
+    leftExceeds: "Left file exceeds 200KB: {name}",
+    rightExceeds: "Right file exceeds 200KB: {name}",
+    publishAnother: "Publish another version to compare.",
+    selectTwoVersions: "Select two versions to compare.",
+    selectFileToCompare: "Select a file to compare.",
+    preparingDiff: "Preparing diff\u2026",
+    loadingDiff: "Loading diff\u2026",
+  },
+  skillVersions: {
+    title: "Versions",
+    subtitlePlugin: "Review release history and changelog.",
+    subtitleNonPlugin:
+      "Download older releases or scan the changelog.",
+    auto: "auto",
+    zip: "Zip",
+  },
+  skillComments: {
+    title: "Comments",
+    signInToComment: "Sign in to comment.",
+    placeholder: "Leave a note\u2026",
+    posting: "Posting\u2026",
+    postComment: "Post comment",
+    noComments: "No comments yet.",
+    reportReasonRequired: "Report reason required.",
+    reportPlaceholder: "Why are you reporting this comment?",
+    cancel: "Cancel",
+    reporting: "Reporting\u2026",
+    submitReport: "Submit report",
+    reportWarning:
+      "Reports require a reason. Abuse of reporting may result in bans.",
+    reportFailed: "Failed to report comment",
+    deleting: "Deleting\u2026",
+    delete: "Delete",
+    reportOpen: "Report open",
+    report: "Report",
+  },
+  skillInstall: {
+    runtimeRequirements: "Runtime requirements",
+    clawdis: "Clawdis",
+    os: "OS",
+    bins: "Bins",
+    anyBin: "Any bin",
+    env: "Env",
+    config: "Config",
+    primaryEnv: "Primary env",
+    environmentVariables: "Environment variables",
+    optional: "optional",
+    required: "required",
+    dependencies: "Dependencies",
+    install: "Install",
+    binsLabel: "Bins: {bins}",
+    links: "Links",
+    homepage: "Homepage",
+    repository: "Repository",
+    docs: "Docs",
+    source: "Source",
+  },
+  skillReport: {
+    title: "Report skill",
+    subtitle:
+      "Describe the issue so moderators can review it quickly.",
+    ariaLabel: "Report reason",
+    placeholder: "What should moderators know?",
+    cancel: "Cancel",
+    submitting: "Submitting\u2026",
+    submit: "Submit report",
+  },
+  skillSecurity: {
+    title: "Security Scan",
+    benign: "Benign",
+    malicious: "Malicious",
+    suspicious: "Suspicious",
+    loading: "Loading...",
+    pending: "Pending",
+    error: "Error",
+    viewReport: "View report \u2192",
+    codeInsight: "Code Insight",
+    scanFindings: "Scan Findings in Context",
+    doNotInstall: "Do not install this skill",
+    whatToConsider: "What to consider before installing",
+    assessment: "Assessment",
+    confidence: "{confidence} confidence",
+  },
+  installSwitcher: {
+    instruction: "Install any skill folder in one shot:",
+    ariaLabel: "Install command",
+  },
+  userBadge: {
+    by: "by",
+    user: "user",
+  },
+  soulDetail: {
+    loading: "Loading soul\u2026",
+    notFound: "Soul not found.",
+    noSummary: "No summary provided.",
+    currentVersion: "Current version",
+    downloadSoul: "Download SOUL.md",
+    loadingSoul: "Loading SOUL.md\u2026",
+    loadFailed: "Failed to load SOUL.md: {error}",
+    versions: "Versions",
+    auto: "auto",
+    soulMd: "SOUL.md",
+    comments: "Comments",
+    placeholder: "Leave a note\u2026",
+    postComment: "Post comment",
+    noComments: "No comments yet.",
+    signInToComment: "Sign in to comment.",
+    delete: "Delete",
+  },
+  soulsIndex: {
+    title: "Souls",
+    loadingSubtitle: "Loading souls\u2026",
+    showingCount: "{showing} of {total} souls.",
+    filterPlaceholder: "Filter by name, slug, or summary\u2026",
+    sortSouls: "Sort souls",
+    newest: "Newest",
+    recentlyUpdated: "Recently updated",
+    downloads: "Downloads",
+    stars: "Stars",
+    name: "Name",
+    sortDirection: "Sort direction {dir}",
+    list: "List",
+    cards: "Cards",
+    noMatch: "No souls match that filter.",
+    soulBundle: "A SOUL.md bundle.",
+    soulBundleAlt: "SOUL.md bundle.",
+  },
+  userProfile: {
+    loading: "Loading user\u2026",
+    notFound: "User not found.",
+    profileTabs: "Profile tabs",
+    starsTab: "Stars",
+    installedTab: "Installed",
+    published: "Published",
+    publishedSubtitle: "Skills published by this user.",
+    loadingPublished: "Loading published skills\u2026",
+    starsTitle: "Stars",
+    starsSubtitle: "Skills this user has starred.",
+    loadingStars: "Loading stars\u2026",
+    noStars: "No stars yet.",
+    agentReady: "Agent-ready skill pack.",
+    installed: "Installed",
+    installedSubtitle:
+      "Private view. Only you can see your folders/roots. Everyone else only sees aggregated install counts per skill.",
+    showRemoved: "Show removed",
+    hideRemoved: "Hide removed",
+    showJson: "Show JSON",
+    hideJson: "Hide JSON",
+    deleteTelemetry: "Delete telemetry",
+    noTelemetry:
+      "No telemetry yet. Run `clawhub sync` from the CLI.",
+    lastSync: "Last sync {date}",
+    stale: "stale",
+    skillsCount: "{count} skills",
+    noSkillsInRoot: "No skills found in this root.",
+    removed: "removed",
+    deleteTelemetryConfirm: "Delete all telemetry data?",
+  },
+  cliAuth: {
+    preparing: "Preparing\u2026",
+    title: "CLI login",
+    invalidRedirect: "Invalid redirect URL.",
+    runAgain: "Run the CLI again to start a fresh login.",
+    missingState: "Missing state.",
+    signInInstruction:
+      "Sign in to create an API token for the CLI.",
+    signInWithGitHub: "Sign in with GitHub",
+    creatingToken: "Creating token\u2026",
+    redirecting: "Redirecting to CLI\u2026",
+    tokenFailed: "Failed to create token",
+    copyToken: "If redirect fails, copy this token:",
+  },
+  site: {
+    skillsName: "ClawHub",
+    skillsDescription:
+      "ClawHub \u2014 a fast skill registry for agents, with vector search.",
+    soulsName: "SoulHub",
+    soulsDescription:
+      "SoulHub \u2014 the home for SOUL.md bundles and personal system lore.",
+  },
+  common: {
+    by: "by",
+    slugTaken: "Slug is already taken. Choose a different slug.",
+    acceptLicense: "Accept the MIT-0 license terms to publish this skill.",
+    publishFailed: "Publish failed. Please try again.",
+  },
+} as const satisfies import("../types").TranslationMap;
diff --git a/src/i18n/locales/zh-CN.ts b/src/i18n/locales/zh-CN.ts
new file mode 100644
index 0000000000..9ae893071d
--- /dev/null
+++ b/src/i18n/locales/zh-CN.ts
@@ -0,0 +1,535 @@
+import type { TranslationMap } from "../types";
+
+export const zhCN: TranslationMap = {
+  header: {
+    skills: "Skills",
+    souls: "Souls",
+    upload: "上传",
+    import: "导入",
+    search: "搜索",
+    stars: "收藏",
+    management: "管理",
+    dashboard: "仪表盘",
+    settings: "设置",
+    signOut: "退出",
+    signIn: "登录",
+    withGitHub: "通过 GitHub",
+    openMenu: "打开菜单",
+    system: "跟随系统",
+    light: "浅色",
+    dark: "深色",
+    systemTheme: "跟随系统主题",
+    lightTheme: "浅色主题",
+    darkTheme: "深色主题",
+    language: "语言",
+    userAvatar: "用户头像",
+  },
+  footer: {
+    an: "",
+    openClaw: "OpenClaw",
+    project: "项目",
+    deployedOn: "部署于",
+    poweredBy: "驱动",
+    openSourceMIT: "开源 (MIT)",
+  },
+  home: {
+    skills: {
+      badge: "轻如龙虾，快如 Agent",
+      title: "ClawHub，为敏锐 Agent 打造的 Skill 港湾",
+      subtitle:
+        "上传 AgentSkills 包，像 npm 一样管理版本，通过向量搜索轻松发现。零门槛，纯干货。",
+      publishSkill: "发布 Skill",
+      browseSkills: "浏览 Skill",
+      searchStat: "搜索 Skill，支持版本管理与回滚",
+      highlightedSkills: "精选 Skill",
+      highlightedSubtitle: "精心挑选，值得信赖",
+      noHighlighted: "暂无精选 Skill。",
+      freshBundle: "全新 Skill 包",
+      popularSkills: "热门 Skill",
+      popularSubtitle: "下载最多的优质精选",
+      noSkills: "还没有 Skill，快来发布第一个吧。",
+      agentReady: "开箱即用的 Skill 包",
+      seeAllSkills: "查看全部 Skill",
+    },
+    souls: {
+      badge: "SOUL.md，共享之道",
+      title: "SoulHub，系统人设的聚集地",
+      subtitle:
+        "分享 SOUL.md 包，像文档一样管理版本，将个人系统人设集中在一个公共空间。",
+      publishSoul: "发布 Soul",
+      browseSouls: "浏览 Soul",
+      searchPlaceholder: "搜索 Soul、提示词或人设",
+      searchStat: "搜索 Soul，版本化、可读、易于 remix",
+      latestSouls: "最新 Soul",
+      latestSubtitle: "Hub 上最新的 SOUL.md 包",
+      noSouls: "还没有 Soul，快来发布第一个吧。",
+      soulBundle: "一个 SOUL.md 包",
+      seeAllSouls: "查看全部 Soul",
+    },
+  },
+  skillsIndex: {
+    title: "Skills",
+    loading: "加载 Skill 中\u2026",
+    browseLibrary: "浏览 Skill 库。",
+  },
+  skillsToolbar: {
+    filterPlaceholder: "按名称、slug 或摘要筛选\u2026",
+    highlighted: "精选",
+    hideSuspicious: "隐藏可疑",
+    relevance: "相关度",
+    newest: "最新",
+    recentlyUpdated: "最近更新",
+    downloads: "下载量",
+    installs: "安装量",
+    stars: "收藏数",
+    name: "名称",
+    sortDirection: "排序方向",
+    list: "列表",
+    cards: "卡片",
+  },
+  skillsResults: {
+    loading: "加载 Skill 中\u2026",
+    noMatch: "没有匹配的 Skill。",
+    pluginBundle: "插件包 (nix)",
+    agentReady: "开箱即用的 Skill 包",
+    noSummary: "暂无摘要。",
+    loadingMore: "加载更多\u2026",
+    scrollToLoad: "滚动加载更多",
+    loadMore: "加载更多",
+    loadingEllipsis: "加载中\u2026",
+  },
+  stars: {
+    signInRequired: "登录后查看你的收藏。",
+    title: "你的收藏",
+    subtitle: "已收藏的 Skill，方便快速访问。",
+    noStars: "暂无收藏。",
+    unstar: "取消收藏",
+  },
+  dashboard: {
+    signInRequired: "登录后访问仪表盘。",
+    mySkills: "我的 Skill",
+    uploadNew: "上传新 Skill",
+    noSkillsTitle: "还没有 Skill",
+    noSkillsText: "上传你的第一个 Skill，与社区分享。",
+    uploadSkill: "上传 Skill",
+    scanning: "扫描中",
+    newVersion: "新版本",
+    view: "查看",
+  },
+  settings: {
+    signInRequired: "登录后访问设置。",
+    title: "设置",
+    displayName: "显示名称",
+    bio: "个人简介",
+    bioPlaceholder: "告诉大家你在构建什么。",
+    save: "保存",
+    saved: "已保存。",
+    apiTokens: "API 令牌",
+    apiTokensSubtitle:
+      "用于 `clawhub` CLI 的令牌。令牌仅在创建时显示一次。",
+    label: "标签",
+    cliToken: "CLI 令牌",
+    createToken: "创建令牌",
+    copyTokenNow: "请立即复制此令牌：",
+    created: "创建于",
+    used: "使用于",
+    revoked: "已撤销",
+    revoke: "撤销",
+    noTokens: "暂无令牌。",
+    dangerZone: "危险操作",
+    dangerText:
+      "永久删除你的账户，此操作不可撤销。已发布的 Skill 将保持公开。",
+    deleteAccount: "删除账户",
+  },
+  upload: {
+    signInRequired: "登录后上传{contentLabel}。",
+    publishTitle: "发布{contentLabel}",
+    dropInstruction:
+      "拖放包含 {requiredFileLabel} 和文本文件的文件夹，其余交给我们。",
+    slug: "Slug",
+    slugPlaceholder: "{contentLabel}-name",
+    displayName: "显示名称",
+    displayNamePlaceholder: "我的{contentLabel}",
+    version: "版本",
+    versionPlaceholder: "1.0.0",
+    tags: "标签",
+    tagsPlaceholder: "latest, stable",
+    dropFolder: "拖放文件夹",
+    filesCount: "{count} 个文件 \u00b7 {sizeLabel}",
+    flattenHint: "我们会保留文件夹路径并自动展开外层目录。",
+    chooseFolder: "选择文件夹",
+    noFiles: "未选择文件。",
+    ignoredJunk: "已忽略 {count} 个 macOS 系统文件{s} ({names})",
+    validation: "验证",
+    allChecksPassed: "全部检查通过。",
+    slugRequired: "Slug 为必填项。",
+    slugFormat: "Slug 必须全部小写且仅使用短横线。",
+    displayNameRequired: "显示名称为必填项。",
+    versionFormat: "版本必须符合 semver 格式（如 1.0.0）。",
+    tagRequired: "至少需要一个标签。",
+    addFile: "请至少添加一个文件。",
+    requiredFile: "{requiredFileLabel} 为必需文件。",
+    removeNonText: "请移除非文本文件：{files}",
+    totalSizeExceeds: "文件总大小超过 50MB。",
+    changelog: "更新日志",
+    changelogPlaceholder: "描述此{contentLabel}的更新内容\u2026",
+    generatingChangelog: "正在生成更新日志\u2026",
+    changelogError: "无法自动生成更新日志。",
+    changelogGenerated: "自动生成的更新日志（可编辑）。",
+    fixValidation: "请修复验证问题后继续。",
+    publishButton: "发布{contentLabel}",
+    uploadingFiles: "正在上传文件\u2026",
+    publishing: "正在发布\u2026",
+    totalSizeError: "每个版本总大小不得超过 50MB。",
+  },
+  import: {
+    signInRequired: "登录后导入并发布 Skill。",
+    loading: "加载中\u2026",
+    kicker: "GitHub 导入",
+    title: "从 GitHub 导入",
+    subtitle: "仅支持公开仓库，自动检测 SKILL.md。",
+    publicOnly: "仅公开",
+    commitPinned: "锁定 Commit",
+    githubUrl: "GitHub URL",
+    repoHint: "仓库、目录路径或文件",
+    placeholder: "https://github.com/owner/repo",
+    detect: "检测",
+    foundSkills: "找到 {count} 个 Skill，请选择一个。",
+    previewFailed: "预览失败",
+    pickSkill: "选择 Skill",
+    repoRoot: "（仓库根目录）",
+    readyToImport: "准备导入。",
+    selectReferenced: "选择引用的",
+    selectAll: "全选",
+    clear: "清除",
+    selected: "已选：{selectedCount}/{totalCount} \u00b7 {size}",
+    importPublish: "导入并发布",
+    importing: "正在导入\u2026",
+    imported: "已导入。",
+    importFailed: "导入失败",
+    redirectFails: "如果重定向失败，请复制此令牌：",
+  },
+  management: {
+    accessRestricted: "仅限管理员。",
+    loading: "加载管理控制台\u2026",
+    title: "管理控制台",
+    subtitle: "审核、策划和所有权工具。",
+    reportedSkills: "被举报的 Skill",
+    searchReported: "搜索被举报的 Skill",
+    filter: "筛选",
+    noMatchingReports: "没有匹配的举报。",
+    noReports: "暂无举报。",
+    showingCount: "显示 {count} / {total}",
+    reports: "条举报",
+    lastTime: "最后 {time}",
+    noReportReasons: "暂无举报原因。",
+    restore: "恢复",
+    hide: "隐藏",
+    hardDelete: "永久删除",
+    skillTools: "Skill 工具",
+    managing: "管理 \u201c{slug}\u201d \u00b7",
+    clearSelection: "清除选择",
+    useManageButton: "使用 Skill 上的管理按钮在此处打开工具。",
+    loadingSkill: "加载 Skill 中\u2026",
+    noSkillFound: "未找到 \u201c{slug}\u201d 对应的 Skill。",
+    duplicateOf: "重复来源",
+    owner: "所有者",
+    setDuplicate: "设为重复",
+    changeOwner: "更改所有者",
+    view: "查看",
+    unhighlight: "取消精选",
+    highlight: "设为精选",
+    banUser: "封禁用户",
+    removeOfficial: "取消官方",
+    markOfficial: "标记官方",
+    removeDeprecated: "取消弃用",
+    markDeprecated: "标记弃用",
+    duplicateCandidates: "疑似重复",
+    noDuplicates: "没有疑似重复。",
+    markDuplicate: "标记重复",
+    recentPushes: "最近推送",
+    noRecentVersions: "暂无最近版本。",
+    users: "用户",
+    searchUsers: "搜索用户",
+    noMatchingUsers: "没有匹配的用户。",
+    noUsers: "暂无用户。",
+    loadingUsers: "加载用户中\u2026",
+    user: "用户",
+    moderator: "版主",
+    admin: "管理员",
+    banConfirm: "封禁 @{handle} 并删除其所有 Skill？",
+    deleteTelemetryConfirm: "删除所有遥测数据？",
+    banOnlyConfirm: "封禁 @{handle}？",
+    unknownSkill: "未知 Skill",
+  },
+  skillDetail: {
+    loading: "加载 Skill 中\u2026",
+    notFound: "未找到 Skill。",
+    reportError: "提交举报失败，请重试。",
+    reportReasonRequired: "举报原因为必填项。",
+    reportSubmitted: "感谢，你的举报已提交。",
+    alreadyReported: "你已经举报过此 Skill。",
+    autoHidden: "超过 4 次独立举报后自动隐藏。",
+    removedFromView: "已从公开列表中移除。",
+    hiddenFromView: "已从公开列表中隐藏。",
+    tagRemoved: "已移除",
+    tagAutoHidden: "自动隐藏",
+    tagHidden: "已隐藏",
+  },
+  skillHeader: {
+    scanInProgress: "安全扫描进行中",
+    scanDescription:
+      "你的 Skill 正在接受 VirusTotal 扫描，扫描完成后将对其他人可见。通常需要 5 分钟左右——喝杯咖啡稍等片刻。",
+    blockedTitle: "Skill 已封锁 — 检测到恶意内容",
+    blockedDescription:
+      "ClawHub Security 将此 Skill 标记为恶意，已禁用下载。请查看下方扫描结果。",
+    suspiciousTitle: "Skill 已标记 — 检测到可疑模式",
+    suspiciousDescription:
+      "ClawHub Security 将此 Skill 标记为可疑，使用前请查看扫描结果。",
+    appealText:
+      "如果你认为此 Skill 被错误标记，请在 GitHub 上提交 issue，我们会解释标记原因及后续步骤。",
+    removedTitle: "Skill 已被版主移除",
+    removedDescription: "此 Skill 已被移除，对其他人不可见。",
+    hiddenTitle: "Skill 已隐藏",
+    hiddenDescription: "此 Skill 当前已隐藏，对其他人不可见。",
+    pluginBundle: "插件包 (nix)",
+    noSummary: "暂无摘要。",
+    bundleNote:
+      "将 Skill 包、CLI 二进制文件和配置需求打包在一个 Nix 安装中。",
+    currentInstalls: "当前安装量",
+    allTimeInstalls: "总安装量",
+    noTags: "暂无标签。",
+    latest: "Latest",
+    updateTag: "更新标签",
+    downloadZip: "下载 zip",
+    currentVersion: "当前版本",
+    skillPack: "Skill 包 \u00b7 CLI \u00b7 配置",
+    skillMd: "SKILL.md",
+    cli: "CLI",
+    config: "配置",
+    configRequirements: "配置需求",
+    requiredEnv: "必需环境变量",
+    stateDirs: "状态目录",
+    cliHelp: "CLI 帮助（来自插件）",
+    unstarSkill: "取消收藏",
+    starSkill: "收藏 Skill",
+    report: "举报",
+    manage: "管理",
+    securityDisclaimer:
+      "如同龙虾壳一般，安全需要层层防护——运行代码前请先审查。",
+    canonical: "规范链接：",
+  },
+  skillTabs: {
+    files: "文件",
+    compare: "对比",
+    versions: "版本",
+    loadingFileViewer: "加载文件查看器\u2026",
+    loadingDiffViewer: "加载差异查看器\u2026",
+  },
+  skillFiles: {
+    skillMd: "SKILL.md",
+    loading: "加载中\u2026",
+    loadFailed: "加载 SKILL.md 失败：{error}",
+    files: "文件",
+    totalCount: "共 {count} 个",
+    noFiles: "暂无文件。",
+    selectFile: "选择文件",
+    selectFilePreview: "选择文件以预览。",
+    fileLoadFailed: "加载文件失败：{error}",
+  },
+  skillDiff: {
+    title: "版本对比",
+    subtitle: "行内或并排对比任意文件。",
+    diffLayout: "对比布局",
+    sideBySide: "并排",
+    inline: "行内",
+    left: "左侧",
+    right: "右侧",
+    selectVersion: "选择版本",
+    swap: "交换",
+    leftRight: "左 {leftLabel} \u2022 右 {rightLabel}",
+    needTwoVersions: "需要至少 2 个版本。",
+    noFilesToCompare: "没有可对比的文件。",
+    leftExceeds: "左侧文件超过 200KB：{name}",
+    rightExceeds: "右侧文件超过 200KB：{name}",
+    publishAnother: "发布新版本后即可对比。",
+    selectTwoVersions: "请选择两个版本进行对比。",
+    selectFileToCompare: "请选择文件进行对比。",
+    preparingDiff: "准备对比\u2026",
+    loadingDiff: "加载对比\u2026",
+  },
+  skillVersions: {
+    title: "版本",
+    subtitlePlugin: "查看发布历史和更新日志。",
+    subtitleNonPlugin: "下载旧版本或查看更新日志。",
+    auto: "自动",
+    zip: "Zip",
+  },
+  skillComments: {
+    title: "评论",
+    signInToComment: "登录后发表评论。",
+    placeholder: "写下你的想法\u2026",
+    posting: "发布中\u2026",
+    postComment: "发表评论",
+    noComments: "暂无评论。",
+    reportReasonRequired: "举报原因为必填项。",
+    reportPlaceholder: "请说明举报原因",
+    cancel: "取消",
+    reporting: "举报中\u2026",
+    submitReport: "提交举报",
+    reportWarning: "举报需填写原因，滥用举报可能导致封禁。",
+    reportFailed: "评论举报失败",
+    deleting: "删除中\u2026",
+    delete: "删除",
+    reportOpen: "举报进行中",
+    report: "举报",
+  },
+  skillInstall: {
+    runtimeRequirements: "运行时要求",
+    clawdis: "Clawdis",
+    os: "操作系统",
+    bins: "二进制",
+    anyBin: "任意二进制",
+    env: "环境变量",
+    config: "配置",
+    primaryEnv: "主环境变量",
+    environmentVariables: "环境变量",
+    optional: "可选",
+    required: "必需",
+    dependencies: "依赖",
+    install: "安装",
+    binsLabel: "二进制：{bins}",
+    links: "链接",
+    homepage: "主页",
+    repository: "仓库",
+    docs: "文档",
+    source: "源码",
+  },
+  skillReport: {
+    title: "举报 Skill",
+    subtitle: "描述问题以便版主快速审核。",
+    ariaLabel: "举报原因",
+    placeholder: "版主需要了解什么？",
+    cancel: "取消",
+    submitting: "提交中\u2026",
+    submit: "提交举报",
+  },
+  skillSecurity: {
+    title: "安全扫描",
+    benign: "安全",
+    malicious: "恶意",
+    suspicious: "可疑",
+    loading: "加载中...",
+    pending: "等待中",
+    error: "错误",
+    viewReport: "查看报告 \u2192",
+    codeInsight: "代码洞察",
+    scanFindings: "上下文中的扫描发现",
+    doNotInstall: "请勿安装此 Skill",
+    whatToConsider: "安装前需要考虑的事项",
+    assessment: "评估",
+    confidence: "{confidence} 置信度",
+  },
+  installSwitcher: {
+    instruction: "一键安装任意 Skill 文件夹：",
+    ariaLabel: "安装命令",
+  },
+  userBadge: {
+    by: "by",
+    user: "用户",
+  },
+  soulDetail: {
+    loading: "加载 Soul 中\u2026",
+    notFound: "未找到 Soul。",
+    noSummary: "暂无摘要。",
+    currentVersion: "当前版本",
+    downloadSoul: "下载 SOUL.md",
+    loadingSoul: "加载 SOUL.md\u2026",
+    loadFailed: "加载 SOUL.md 失败：{error}",
+    versions: "版本",
+    auto: "自动",
+    soulMd: "SOUL.md",
+    comments: "评论",
+    placeholder: "写下你的想法\u2026",
+    postComment: "发表评论",
+    noComments: "暂无评论。",
+    signInToComment: "登录后发表评论。",
+    delete: "删除",
+  },
+  soulsIndex: {
+    title: "Souls",
+    loadingSubtitle: "加载 Soul 中\u2026",
+    showingCount: "显示 {showing} / {total} 个 Soul",
+    filterPlaceholder: "按名称、slug 或摘要筛选\u2026",
+    sortSouls: "排序 Soul",
+    newest: "最新",
+    recentlyUpdated: "最近更新",
+    downloads: "下载量",
+    stars: "收藏数",
+    name: "名称",
+    sortDirection: "排序方向 {dir}",
+    list: "列表",
+    cards: "卡片",
+    noMatch: "没有匹配的 Soul。",
+    soulBundle: "一个 SOUL.md 包",
+    soulBundleAlt: "SOUL.md 包",
+  },
+  userProfile: {
+    loading: "加载用户中\u2026",
+    notFound: "未找到用户。",
+    profileTabs: "个人主页标签",
+    starsTab: "收藏",
+    installedTab: "已安装",
+    published: "已发布",
+    publishedSubtitle: "此用户发布的 Skill。",
+    loadingPublished: "加载已发布 Skill\u2026",
+    starsTitle: "收藏",
+    starsSubtitle: "此用户收藏的 Skill。",
+    loadingStars: "加载收藏\u2026",
+    noStars: "暂无收藏。",
+    agentReady: "开箱即用的 Skill 包",
+    installed: "已安装",
+    installedSubtitle:
+      "仅自己可见。其他人只能看到每个 Skill 的总安装次数。",
+    showRemoved: "显示已移除",
+    hideRemoved: "隐藏已移除",
+    showJson: "显示 JSON",
+    hideJson: "隐藏 JSON",
+    deleteTelemetry: "删除遥测",
+    noTelemetry:
+      "暂无遥测数据。请在 CLI 中运行 `clawhub sync`。",
+    lastSync: "上次同步 {date}",
+    stale: "过时",
+    skillsCount: "{count} 个 Skill",
+    noSkillsInRoot: "此路径下未找到 Skill。",
+    removed: "已移除",
+    deleteTelemetryConfirm: "删除所有遥测数据？",
+  },
+  cliAuth: {
+    preparing: "准备中\u2026",
+    title: "CLI 登录",
+    invalidRedirect: "无效的重定向 URL。",
+    runAgain: "请重新运行 CLI 以开始新的登录。",
+    missingState: "缺少状态参数。",
+    signInInstruction: "登录后为 CLI 创建 API 令牌。",
+    signInWithGitHub: "通过 GitHub 登录",
+    creatingToken: "正在创建令牌\u2026",
+    redirecting: "正在重定向到 CLI\u2026",
+    tokenFailed: "创建令牌失败",
+    copyToken: "如果重定向失败，请复制此令牌：",
+  },
+  site: {
+    skillsName: "ClawHub",
+    skillsDescription:
+      "ClawHub \u2014 面向 Agent 的快速 Skill 注册中心，支持向量搜索。",
+    soulsName: "SoulHub",
+    soulsDescription:
+      "SoulHub \u2014 SOUL.md 包与个人系统人设的集散地。",
+  },
+  common: {
+    by: "by",
+    slugTaken: "此 Slug 已被占用，请选择其他 Slug。",
+    acceptLicense: "请接受 MIT-0 许可条款以发布此 Skill。",
+    publishFailed: "发布失败，请重试。",
+  },
+};
diff --git a/src/i18n/translate.ts b/src/i18n/translate.ts
new file mode 100644
index 0000000000..556d9b533e
--- /dev/null
+++ b/src/i18n/translate.ts
@@ -0,0 +1,81 @@
+import type { FlattenKeys, Locale, TranslationMap } from "./types";
+import { en } from "./locales/en";
+import { zhCN } from "./locales/zh-CN";
+
+/** Union of all valid dot-path translation keys, derived from en.ts */
+export type TranslationKey = FlattenKeys<typeof en>;
+
+const locales: Record<Locale, TranslationMap> = {
+  en,
+  "zh-CN": zhCN,
+};
+
+type Subscriber = () => void;
+
+class I18nManager {
+  private locale: Locale;
+  private subscribers: Set<Subscriber> = new Set();
+
+  constructor() {
+    this.locale = this.detectLocale();
+  }
+
+  private detectLocale(): Locale {
+    if (typeof globalThis.localStorage !== "undefined") {
+      const stored = localStorage.getItem("clawhub.locale");
+      if (stored === "en" || stored === "zh-CN") return stored;
+    }
+    if (typeof globalThis.navigator !== "undefined" && typeof navigator.language === "string") {
+      return navigator.language.startsWith("zh") ? "zh-CN" : "en";
+    }
+    return "en";
+  }
+
+  getLocale(): Locale {
+    return this.locale;
+  }
+
+  setLocale(locale: Locale) {
+    if (this.locale === locale) return;
+    this.locale = locale;
+    if (typeof globalThis.localStorage !== "undefined") {
+      localStorage.setItem("clawhub.locale", locale);
+    }
+    this.subscribers.forEach((fn) => fn());
+  }
+
+  subscribe(fn: Subscriber): () => void {
+    this.subscribers.add(fn);
+    return () => {
+      this.subscribers.delete(fn);
+    };
+  }
+
+  t(key: TranslationKey, params?: Record<string, string | number>): string {
+    let value = this.resolve(locales[this.locale], key);
+    if (value === undefined) {
+      value = this.resolve(locales.en, key);
+    }
+    if (value === undefined) return key;
+    if (params) {
+      return value.replace(/\{(\w+)\}/g, (_, k) =>
+        params[k] !== undefined ? String(params[k]) : `{${k}}`,
+      );
+    }
+    return value;
+  }
+
+  private resolve(map: TranslationMap, key: string): string | undefined {
+    const parts = key.split(".");
+    let current: string | TranslationMap = map;
+    for (const part of parts) {
+      if (typeof current !== "object" || current === null) return undefined;
+      current = (current as TranslationMap)[part];
+    }
+    return typeof current === "string" ? current : undefined;
+  }
+}
+
+export const i18n = new I18nManager();
+export const t = (key: TranslationKey, params?: Record<string, string | number>) =>
+  i18n.t(key, params);
diff --git a/src/i18n/types.ts b/src/i18n/types.ts
new file mode 100644
index 0000000000..582217206b
--- /dev/null
+++ b/src/i18n/types.ts
@@ -0,0 +1,18 @@
+export type TranslationMap = { [key: string]: string | TranslationMap };
+export type Locale = "en" | "zh-CN";
+
+/**
+ * Recursively flatten a nested translation object into dot-path union keys.
+ * e.g. { header: { skills: "Skills" } } → "header.skills"
+ */
+export type FlattenKeys<
+  T,
+  Prefix extends string = "",
+> = T extends string
+  ? Prefix
+  : {
+      [K in keyof T & string]: FlattenKeys<
+        T[K],
+        Prefix extends "" ? K : `${Prefix}.${K}`
+      >;
+    }[keyof T & string];
diff --git a/src/i18n/useI18n.ts b/src/i18n/useI18n.ts
new file mode 100644
index 0000000000..75b7863ff1
--- /dev/null
+++ b/src/i18n/useI18n.ts
@@ -0,0 +1,21 @@
+import { useSyncExternalStore, useCallback } from "react";
+import { i18n, type TranslationKey } from "./translate";
+import type { Locale } from "./types";
+
+export function useI18n() {
+  const locale = useSyncExternalStore(
+    (cb) => i18n.subscribe(cb),
+    () => i18n.getLocale(),
+  );
+
+  const t = useCallback(
+    (key: TranslationKey, params?: Record<string, string | number>) =>
+      i18n.t(key, params),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [locale],
+  );
+
+  const setLocale = useCallback((l: Locale) => i18n.setLocale(l), []);
+
+  return { t, locale, setLocale };
+}
diff --git a/src/lib/slugCollision.ts b/src/lib/slugCollision.ts
index 4726a93a8f..673ad17159 100644
--- a/src/lib/slugCollision.ts
+++ b/src/lib/slugCollision.ts
@@ -1,3 +1,5 @@
+import { t } from '../i18n'
+
 type SlugAvailabilityResult =
   | {
       available: boolean
@@ -22,7 +24,7 @@ export function getPublicSlugCollision(params: {
   if (!normalizedSlug) return null
   if (!params.result || params.result.available) return null
   return {
-    message: params.result.message?.trim() || 'Slug is already taken. Choose a different slug.',
+    message: params.result.message?.trim() || t('common.slugTaken'),
     url: params.result.url ?? null,
   }
 }
diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
index 3bc872ea21..97f7ad1c2c 100644
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -7,15 +7,17 @@ import { ClientOnly } from '../components/ClientOnly'
 import { DeploymentDriftBanner } from '../components/DeploymentDriftBanner'
 import { Footer } from '../components/Footer'
 import Header from '../components/Header'
-import { getSiteDescription, getSiteMode, getSiteName, getSiteUrlForMode } from '../lib/site'
+import { t, useI18n } from '../i18n'
+import { getSiteMode, getSiteUrlForMode } from '../lib/site'
 
 import appCss from '../styles.css?url'
 
 export const Route = createRootRoute({
   head: () => {
     const mode = getSiteMode()
-    const siteName = getSiteName(mode)
-    const siteDescription = getSiteDescription(mode)
+    const siteName = mode === 'souls' ? t('site.soulsName') : t('site.skillsName')
+    const siteDescription =
+      mode === 'souls' ? t('site.soulsDescription') : t('site.skillsDescription')
     const siteUrl = getSiteUrlForMode(mode)
     const ogImage = `${siteUrl}/og.png`
 
@@ -101,8 +103,9 @@ export const Route = createRootRoute({
 })
 
 function RootDocument({ children }: { children: React.ReactNode }) {
+  const { locale } = useI18n()
   return (
-    <html lang="en">
+    <html lang={locale}>
       <head>
         <HeadContent />
       </head>
diff --git a/src/routes/cli/auth.tsx b/src/routes/cli/auth.tsx
index 24381f44b2..4a21b99a39 100644
--- a/src/routes/cli/auth.tsx
+++ b/src/routes/cli/auth.tsx
@@ -3,6 +3,7 @@ import { createFileRoute } from '@tanstack/react-router'
 import { useMutation } from 'convex/react'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import { api } from '../../../convex/_generated/api'
+import { useI18n } from '../../i18n/useI18n'
 import { getClawHubSiteUrl, normalizeClawHubSiteOrigin } from '../../lib/site'
 import { useAuthStatus } from '../../lib/useAuthStatus'
 
@@ -11,6 +12,7 @@ export const Route = createFileRoute('/cli/auth')({
 })
 
 function CliAuth() {
+  const { t } = useI18n()
   const { isAuthenticated, isLoading, me } = useAuthStatus()
   const { signIn } = useAuthActions()
   const createToken = useMutation(api.tokens.create)
@@ -21,7 +23,7 @@ function CliAuth() {
     label_b64?: string
     state?: string
   }
-  const [status, setStatus] = useState<string>('Preparing…')
+  const [status, setStatus] = useState<string>(t('cliAuth.preparing'))
   const [token, setToken] = useState<string | null>(null)
   const hasRun = useRef(false)
 
@@ -46,10 +48,10 @@ function CliAuth() {
     hasRun.current = true
 
     const run = async () => {
-      setStatus('Creating token…')
+      setStatus(t('cliAuth.creatingToken'))
       const result = await createToken({ label })
       setToken(result.token)
-      setStatus('Redirecting to CLI…')
+      setStatus(t('cliAuth.redirecting'))
       const hash = new URLSearchParams()
       hash.set('token', result.token)
       hash.set('registry', registry)
@@ -58,7 +60,7 @@ function CliAuth() {
     }
 
     void run().catch((error) => {
-      const message = error instanceof Error ? error.message : 'Failed to create token'
+      const message = error instanceof Error ? error.message : t('cliAuth.tokenFailed')
       setStatus(message)
       setToken(null)
     })
@@ -69,11 +71,11 @@ function CliAuth() {
       <main className="section">
         <div className="card">
           <h1 className="section-title" style={{ marginTop: 0 }}>
-            CLI login
+            {t('cliAuth.title')}
           </h1>
-          <p className="section-subtitle">Invalid redirect URL.</p>
+          <p className="section-subtitle">{t('cliAuth.invalidRedirect')}</p>
           <p className="section-subtitle" style={{ marginBottom: 0 }}>
-            Run the CLI again to start a fresh login.
+            {t('cliAuth.runAgain')}
           </p>
         </div>
       </main>
@@ -85,11 +87,11 @@ function CliAuth() {
       <main className="section">
         <div className="card">
           <h1 className="section-title" style={{ marginTop: 0 }}>
-            CLI login
+            {t('cliAuth.title')}
           </h1>
-          <p className="section-subtitle">Missing state.</p>
+          <p className="section-subtitle">{t('cliAuth.missingState')}</p>
           <p className="section-subtitle" style={{ marginBottom: 0 }}>
-            Run the CLI again to start a fresh login.
+            {t('cliAuth.runAgain')}
           </p>
         </div>
       </main>
@@ -101,9 +103,9 @@ function CliAuth() {
       <main className="section">
         <div className="card">
           <h1 className="section-title" style={{ marginTop: 0 }}>
-            CLI login
+            {t('cliAuth.title')}
           </h1>
-          <p className="section-subtitle">Sign in to create an API token for the CLI.</p>
+          <p className="section-subtitle">{t('cliAuth.signInInstruction')}</p>
           <button
             className="btn btn-primary"
             type="button"
@@ -112,7 +114,7 @@ function CliAuth() {
               void signIn('github', signInRedirectTo ? { redirectTo: signInRedirectTo } : undefined)
             }
           >
-            Sign in with GitHub
+            {t('cliAuth.signInWithGitHub')}
           </button>
         </div>
       </main>
@@ -128,7 +130,7 @@ function CliAuth() {
         <p className="section-subtitle">{status}</p>
         {token ? (
           <div className="stat" style={{ overflowX: 'auto' }}>
-            <div style={{ marginBottom: 8 }}>If redirect fails, copy this token:</div>
+            <div style={{ marginBottom: 8 }}>{t('cliAuth.copyToken')}</div>
             <code>{token}</code>
           </div>
         ) : null}
diff --git a/src/routes/dashboard.tsx b/src/routes/dashboard.tsx
index d4dc974629..06737c5ffd 100644
--- a/src/routes/dashboard.tsx
+++ b/src/routes/dashboard.tsx
@@ -3,6 +3,7 @@ import { useQuery } from 'convex/react'
 import { Clock, Package, Plus, Upload } from 'lucide-react'
 import { api } from '../../convex/_generated/api'
 import type { Doc } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n'
 import { formatCompactStat } from '../lib/numberFormat'
 import type { PublicSkill } from '../lib/publicUser'
 
@@ -13,6 +14,7 @@ export const Route = createFileRoute('/dashboard')({
 })
 
 function Dashboard() {
+  const { t } = useI18n()
   const me = useQuery(api.users.me) as Doc<'users'> | null | undefined
   const mySkills = useQuery(
     api.skills.list,
@@ -22,7 +24,7 @@ function Dashboard() {
   if (!me) {
     return (
       <main className="section">
-        <div className="card">Sign in to access your dashboard.</div>
+        <div className="card">{t('dashboard.signInRequired')}</div>
       </main>
     )
   }
@@ -34,22 +36,22 @@ function Dashboard() {
     <main className="section">
       <div className="dashboard-header">
         <h1 className="section-title" style={{ margin: 0 }}>
-          My Skills
+          {t('dashboard.mySkills')}
         </h1>
         <Link to="/upload" search={{ updateSlug: undefined }} className="btn btn-primary">
           <Plus className="h-4 w-4" aria-hidden="true" />
-          Upload New Skill
+          {t('dashboard.uploadNew')}
         </Link>
       </div>
 
       {skills.length === 0 ? (
         <div className="card dashboard-empty">
           <Package className="dashboard-empty-icon" aria-hidden="true" />
-          <h2>No skills yet</h2>
-          <p>Upload your first skill to share it with the community.</p>
+          <h2>{t('dashboard.noSkillsTitle')}</h2>
+          <p>{t('dashboard.noSkillsText')}</p>
           <Link to="/upload" search={{ updateSlug: undefined }} className="btn btn-primary">
             <Upload className="h-4 w-4" aria-hidden="true" />
-            Upload a Skill
+            {t('dashboard.uploadSkill')}
           </Link>
         </div>
       ) : (
@@ -64,6 +66,7 @@ function Dashboard() {
 }
 
 function SkillCard({ skill, ownerHandle }: { skill: DashboardSkill; ownerHandle: string | null }) {
+  const { t } = useI18n()
   return (
     <div className="dashboard-skill-card">
       <div className="dashboard-skill-info">
@@ -79,7 +82,7 @@ function SkillCard({ skill, ownerHandle }: { skill: DashboardSkill; ownerHandle:
           {skill.pendingReview ? (
             <span className="tag tag-pending">
               <Clock className="h-3 w-3" aria-hidden="true" />
-              Scanning
+              {t('dashboard.scanning')}
             </span>
           ) : null}
         </div>
@@ -95,14 +98,14 @@ function SkillCard({ skill, ownerHandle }: { skill: DashboardSkill; ownerHandle:
       <div className="dashboard-skill-actions">
         <Link to="/upload" search={{ updateSlug: skill.slug }} className="btn btn-sm">
           <Upload className="h-3 w-3" aria-hidden="true" />
-          New Version
+          {t('dashboard.newVersion')}
         </Link>
         <Link
           to="/$owner/$slug"
           params={{ owner: ownerHandle ?? 'unknown', slug: skill.slug }}
           className="btn btn-ghost btn-sm"
         >
-          View
+          {t('dashboard.view')}
         </Link>
       </div>
     </div>
diff --git a/src/routes/import.tsx b/src/routes/import.tsx
index e74e0c4114..59bbb4aeb5 100644
--- a/src/routes/import.tsx
+++ b/src/routes/import.tsx
@@ -5,6 +5,7 @@ import { api } from '../../convex/_generated/api'
 import { getUserFacingConvexError } from '../lib/convexError'
 import { getPublicSlugCollision } from '../lib/slugCollision'
 import { formatBytes } from '../lib/uploadUtils'
+import { useI18n } from '../i18n/useI18n'
 import { useAuthStatus } from '../lib/useAuthStatus'
 
 export const Route = createFileRoute('/import')({
@@ -47,6 +48,7 @@ export function ImportGitHub() {
   const previewCandidate = useAction(api.githubImport.previewGitHubImportCandidate)
   const importSkill = useAction(api.githubImport.importGitHubSkill)
   const navigate = useNavigate()
+  const { t } = useI18n()
 
   const [url, setUrl] = useState('')
   const [candidates, setCandidates] = useState<Candidate[]>([])
@@ -113,10 +115,12 @@ export function ImportGitHub() {
         const only = items[0]
         if (only) await loadCandidate(only.path)
       } else {
-        setStatus(`Found ${items.length} skills. Pick one.`)
+        setStatus(t('import.foundSkills', { count: String(items.length) }))
       }
     } catch (e) {
-      setError(getUserFacingConvexError(e, 'Preview failed'))
+
+      setError(getUserFacingConvexError(e, t('import.previewFailed')))
+
     } finally {
       setIsBusy(false)
     }
@@ -142,9 +146,11 @@ export function ImportGitHub() {
       const nextSelected: Record<string, boolean> = {}
       for (const file of result.files) nextSelected[file.path] = file.defaultSelected
       setSelected(nextSelected)
-      setStatus('Ready to import.')
+      setStatus(t('import.readyToImport'))
     } catch (e) {
-      setError(getUserFacingConvexError(e, 'Preview failed'))
+
+      setError(getUserFacingConvexError(e, t('import.previewFailed')))
+
     } finally {
       setIsBusy(false)
     }
@@ -180,7 +186,7 @@ export function ImportGitHub() {
     }
     setIsBusy(true)
     setError(null)
-    setStatus('Importing…')
+    setStatus(t('import.importing'))
     try {
       const selectedPaths = preview.files.map((file) => file.path).filter((path) => selected[path])
       const tagList = tags
@@ -198,11 +204,13 @@ export function ImportGitHub() {
         tags: tagList,
       })
       const nextSlug = result.slug
-      setStatus('Imported.')
+      setStatus(t('import.imported'))
       const ownerParam = me?.handle ?? (me?._id ? String(me._id) : 'unknown')
       await navigate({ to: '/$owner/$slug', params: { owner: ownerParam, slug: nextSlug } })
     } catch (e) {
-      setError(getUserFacingConvexError(e, 'Import failed'))
+
+      setError(getUserFacingConvexError(e, t('import.importFailed')))
+
       setStatus(null)
     } finally {
       setIsBusy(false)
@@ -213,7 +221,7 @@ export function ImportGitHub() {
     return (
       <main className="section">
         <div className="card">
-          {isLoading ? 'Loading…' : 'Sign in to import and publish skills.'}
+          {isLoading ? t('import.loading') : t('import.signInRequired')}
         </div>
       </main>
     )
@@ -223,13 +231,13 @@ export function ImportGitHub() {
     <main className="section upload-shell">
       <div className="upload-header">
         <div>
-          <div className="upload-kicker">GitHub import</div>
-          <h1 className="upload-title">Import from GitHub</h1>
-          <p className="upload-subtitle">Public repos only. Detects SKILL.md automatically.</p>
+          <div className="upload-kicker">{t('import.kicker')}</div>
+          <h1 className="upload-title">{t('import.title')}</h1>
+          <p className="upload-subtitle">{t('import.subtitle')}</p>
         </div>
         <div className="upload-badge">
-          <div>Public only</div>
-          <div className="upload-badge-sub">Commit pinned</div>
+          <div>{t('import.publicOnly')}</div>
+          <div className="upload-badge-sub">{t('import.commitPinned')}</div>
         </div>
       </div>
 
@@ -237,15 +245,15 @@ export function ImportGitHub() {
         <div className="upload-fields">
           <label className="upload-field" htmlFor="github-url">
             <div className="upload-field-header">
-              <strong>GitHub URL</strong>
-              <span className="upload-field-hint">Repo, tree path, or blob</span>
+              <strong>{t('import.githubUrl')}</strong>
+              <span className="upload-field-hint">{t('import.repoHint')}</span>
             </div>
             <input
               id="github-url"
               className="upload-input"
               value={url}
               onChange={(e) => setUrl(e.target.value)}
-              placeholder="https://github.com/owner/repo"
+              placeholder={t('import.placeholder')}
               autoCapitalize="none"
               autoCorrect="off"
               spellCheck={false}
@@ -260,7 +268,7 @@ export function ImportGitHub() {
             disabled={!url.trim() || isBusy}
             onClick={() => void detect()}
           >
-            Detect
+            {t('import.detect')}
           </button>
           {status ? <p className="upload-muted">{status}</p> : null}
         </div>
@@ -274,7 +282,7 @@ export function ImportGitHub() {
 
       {candidates.length > 1 ? (
         <div className="card">
-          <h2 style={{ margin: 0 }}>Pick a skill</h2>
+          <h2 style={{ margin: 0 }}>{t('import.pickSkill')}</h2>
           <div className="upload-filelist">
             {candidates.map((candidate) => (
               <label key={candidate.path} className="upload-file">
@@ -285,7 +293,7 @@ export function ImportGitHub() {
                   onChange={() => void loadCandidate(candidate.path)}
                   disabled={isBusy}
                 />
-                <span className="mono">{candidate.path || '(repo root)'}</span>
+                <span className="mono">{candidate.path || t('import.repoRoot')}</span>
                 <span>
                   {candidate.name
                     ? candidate.name
@@ -366,7 +374,7 @@ export function ImportGitHub() {
               </div>
               <aside className="upload-side">
                 <div className="upload-summary">
-                  <div className="upload-requirement ok">Commit pinned</div>
+                  <div className="upload-requirement ok">{t('import.commitPinned')}</div>
                   <div className="upload-muted">
                     {preview.resolved.owner}/{preview.resolved.repo}@
                     {preview.resolved.commit.slice(0, 7)}
@@ -394,18 +402,18 @@ export function ImportGitHub() {
                   disabled={isBusy}
                   onClick={applyDefaultSelection}
                 >
-                  Select referenced
+                  {t('import.selectReferenced')}
                 </button>
                 <button className="btn" type="button" disabled={isBusy} onClick={selectAll}>
-                  Select all
+                  {t('import.selectAll')}
                 </button>
                 <button className="btn" type="button" disabled={isBusy} onClick={clearAll}>
-                  Clear
+                  {t('import.clear')}
                 </button>
               </div>
             </div>
             <div className="upload-muted">
-              Selected: {selectedCount}/{preview.files.length} • {formatBytes(selectedBytes)}
+              {t('import.selected', { selectedCount: String(selectedCount), totalCount: String(preview.files.length), size: formatBytes(selectedBytes) })}
             </div>
             <div className="file-list">
               {preview.files.map((file) => (
@@ -437,7 +445,7 @@ export function ImportGitHub() {
                 }
                 onClick={() => void doImport()}
               >
-                Import + publish
+                {t('import.importPublish')}
               </button>
               {slugCollision ? (
                 <div className="upload-muted">
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index 38c271cbb1..c9dac90e0c 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -8,6 +8,7 @@ import { SkillStatsTripletLine } from '../components/SkillStats'
 import { SoulCard } from '../components/SoulCard'
 import { SoulStatsTripletLine } from '../components/SoulStats'
 import { UserBadge } from '../components/UserBadge'
+import { useI18n } from '../i18n'
 import { getSkillBadges } from '../lib/badges'
 import type { PublicSkill, PublicSoul, PublicUser } from '../lib/publicUser'
 import { getSiteMode } from '../lib/site'
@@ -22,6 +23,7 @@ function Home() {
 }
 
 function SkillsHome() {
+  const { t } = useI18n()
   type SkillPageEntry = {
     skill: PublicSkill
     ownerHandle?: string | null
@@ -44,15 +46,14 @@ function SkillsHome() {
       <section className="hero">
         <div className="hero-inner">
           <div className="hero-copy fade-up" data-delay="1">
-            <span className="hero-badge">Lobster-light. Agent-right.</span>
-            <h1 className="hero-title">ClawHub, the skill dock for sharp agents.</h1>
+            <span className="hero-badge">{t('home.skills.badge')}</span>
+            <h1 className="hero-title">{t('home.skills.title')}</h1>
             <p className="hero-subtitle">
-              Upload AgentSkills bundles, version them like npm, and make them searchable with
-              vectors. No gatekeeping, just signal.
+              {t('home.skills.subtitle')}
             </p>
             <div style={{ display: 'flex', gap: 12, marginTop: 20 }}>
               <Link to="/upload" search={{ updateSlug: undefined }} className="btn btn-primary">
-                Publish a skill
+                {t('home.skills.publishSkill')}
               </Link>
               <Link
                 to="/skills"
@@ -67,13 +68,13 @@ function SkillsHome() {
                 }}
                 className="btn"
               >
-                Browse skills
+                {t('home.skills.browseSkills')}
               </Link>
             </div>
           </div>
           <div className="hero-card hero-search-card fade-up" data-delay="2">
             <div className="hero-install" style={{ marginTop: 18 }}>
-              <div className="stat">Search skills. Versioned, rollback-ready.</div>
+              <div className="stat">{t('home.skills.searchStat')}</div>
               <InstallSwitcher exampleSlug="sonoscli" />
             </div>
           </div>
@@ -81,24 +82,24 @@ function SkillsHome() {
       </section>
 
       <section className="section">
-        <h2 className="section-title">Highlighted skills</h2>
-        <p className="section-subtitle">Curated signal — highlighted for quick trust.</p>
+        <h2 className="section-title">{t('home.skills.highlightedSkills')}</h2>
+        <p className="section-subtitle">{t('home.skills.highlightedSubtitle')}</p>
         <div className="grid">
           {highlighted.length === 0 ? (
-            <div className="card">No highlighted skills yet.</div>
+            <div className="card">{t('home.skills.noHighlighted')}</div>
           ) : (
             highlighted.map((entry) => (
               <SkillCard
                 key={entry.skill._id}
                 skill={entry.skill}
                 badge={getSkillBadges(entry.skill)}
-                summaryFallback="A fresh skill bundle."
+                summaryFallback={t('home.skills.freshBundle')}
                 meta={
                   <div className="skill-card-footer-rows">
                     <UserBadge
                       user={entry.owner}
                       fallbackHandle={entry.ownerHandle ?? null}
-                      prefix="by"
+                      prefix={t('userBadge.by')}
                       link={false}
                     />
                     <div className="stat">
@@ -113,23 +114,23 @@ function SkillsHome() {
       </section>
 
       <section className="section">
-        <h2 className="section-title">Popular skills</h2>
-        <p className="section-subtitle">Most-downloaded, non-suspicious picks.</p>
+        <h2 className="section-title">{t('home.skills.popularSkills')}</h2>
+        <p className="section-subtitle">{t('home.skills.popularSubtitle')}</p>
         <div className="grid">
           {popular.length === 0 ? (
-            <div className="card">No skills yet. Be the first.</div>
+            <div className="card">{t('home.skills.noSkills')}</div>
           ) : (
             popular.map((entry) => (
               <SkillCard
                 key={entry.skill._id}
                 skill={entry.skill}
-                summaryFallback="Agent-ready skill pack."
+                summaryFallback={t('home.skills.agentReady')}
                 meta={
                   <div className="skill-card-footer-rows">
                     <UserBadge
                       user={entry.owner}
                       fallbackHandle={entry.ownerHandle ?? null}
-                      prefix="by"
+                      prefix={t('userBadge.by')}
                       link={false}
                     />
                     <div className="stat">
@@ -155,7 +156,7 @@ function SkillsHome() {
             }}
             className="btn"
           >
-            See all skills
+            {t('home.skills.seeAllSkills')}
           </Link>
         </div>
       </section>
@@ -164,6 +165,7 @@ function SkillsHome() {
 }
 
 function OnlyCrabsHome() {
+  const { t } = useI18n()
   const navigate = Route.useNavigate()
   const ensureSoulSeeds = useAction(api.seed.ensureSoulSeeds)
   const latest = (useQuery(api.souls.list, { limit: 12 }) as PublicSoul[]) ?? []
@@ -182,15 +184,14 @@ function OnlyCrabsHome() {
       <section className="hero">
         <div className="hero-inner">
           <div className="hero-copy fade-up" data-delay="1">
-            <span className="hero-badge">SOUL.md, shared.</span>
-            <h1 className="hero-title">SoulHub, where system lore lives.</h1>
+            <span className="hero-badge">{t('home.souls.badge')}</span>
+            <h1 className="hero-title">{t('home.souls.title')}</h1>
             <p className="hero-subtitle">
-              Share SOUL.md bundles, version them like docs, and keep personal system lore in one
-              public place.
+              {t('home.souls.subtitle')}
             </p>
             <div style={{ display: 'flex', gap: 12, marginTop: 20 }}>
               <Link to="/upload" search={{ updateSlug: undefined }} className="btn btn-primary">
-                Publish a soul
+                {t('home.souls.publishSoul')}
               </Link>
               <Link
                 to="/souls"
@@ -203,7 +204,7 @@ function OnlyCrabsHome() {
                 }}
                 className="btn"
               >
-                Browse souls
+                {t('home.souls.browseSouls')}
               </Link>
             </div>
           </div>
@@ -227,30 +228,30 @@ function OnlyCrabsHome() {
               <span className="mono">/</span>
               <input
                 className="search-input"
-                placeholder="Search souls, prompts, or lore"
+                placeholder={t('home.souls.searchPlaceholder')}
                 value={query}
                 onChange={(event) => setQuery(event.target.value)}
               />
             </form>
             <div className="hero-install" style={{ marginTop: 18 }}>
-              <div className="stat">Search souls. Versioned, readable, easy to remix.</div>
+              <div className="stat">{t('home.souls.searchStat')}</div>
             </div>
           </div>
         </div>
       </section>
 
       <section className="section">
-        <h2 className="section-title">Latest souls</h2>
-        <p className="section-subtitle">Newest SOUL.md bundles across the hub.</p>
+        <h2 className="section-title">{t('home.souls.latestSouls')}</h2>
+        <p className="section-subtitle">{t('home.souls.latestSubtitle')}</p>
         <div className="grid">
           {latest.length === 0 ? (
-            <div className="card">No souls yet. Be the first.</div>
+            <div className="card">{t('home.souls.noSouls')}</div>
           ) : (
             latest.map((soul) => (
               <SoulCard
                 key={soul._id}
                 soul={soul}
-                summaryFallback="A SOUL.md bundle."
+                summaryFallback={t('home.souls.soulBundle')}
                 meta={
                   <div className="stat">
                     <SoulStatsTripletLine stats={soul.stats} />
@@ -272,7 +273,7 @@ function OnlyCrabsHome() {
             }}
             className="btn"
           >
-            See all souls
+            {t('home.souls.seeAllSouls')}
           </Link>
         </div>
       </section>
diff --git a/src/routes/management.tsx b/src/routes/management.tsx
index 3f5fec841c..7f24a25b83 100644
--- a/src/routes/management.tsx
+++ b/src/routes/management.tsx
@@ -9,6 +9,7 @@ import {
   isSkillHighlighted,
   isSkillOfficial,
 } from '../lib/badges'
+import { useI18n } from '../i18n/useI18n'
 import { isAdmin, isModerator } from '../lib/roles'
 import { useAuthStatus } from '../lib/useAuthStatus'
 
@@ -72,6 +73,7 @@ export const Route = createFileRoute('/management')({
 })
 
 function Management() {
+  const { t } = useI18n()
   const { me } = useAuthStatus()
   const search = Route.useSearch()
   const staff = isModerator(me)
@@ -139,7 +141,7 @@ function Management() {
   if (!staff) {
     return (
       <main className="section">
-        <div className="card">Management only.</div>
+        <div className="card">{t('management.accessRestricted')}</div>
       </main>
     )
   }
@@ -147,7 +149,7 @@ function Management() {
   if (!recentVersions || !reportedSkills || !duplicateCandidates) {
     return (
       <main className="section">
-        <div className="card">Loading management console…</div>
+        <div className="card">{t('management.loading')}</div>
       </main>
     )
   }
@@ -176,38 +178,38 @@ function Management() {
     : reportedSkills
   const reportCountLabel =
     filteredReportedSkills.length === 0 && reportedSkills.length > 0
-      ? 'No matching reports.'
-      : 'No reports yet.'
-  const reportSummary = `Showing ${filteredReportedSkills.length} of ${reportedSkills.length}`
+      ? t('management.noMatchingReports')
+      : t('management.noReports')
+  const reportSummary = t('management.showingCount', { count: String(filteredReportedSkills.length), total: String(reportedSkills.length) })
 
   const filteredUsers = userResult?.items ?? []
   const userTotal = userResult?.total ?? 0
   const userSummary = userResult
-    ? `Showing ${filteredUsers.length} of ${userTotal}`
-    : 'Loading users…'
+    ? t('management.showingCount', { count: String(filteredUsers.length), total: String(userTotal) })
+    : t('management.loadingUsers')
   const userEmptyLabel = userResult
     ? filteredUsers.length === 0
       ? userQuery
-        ? 'No matching users.'
-        : 'No users yet.'
+        ? t('management.noMatchingUsers')
+        : t('management.noUsers')
       : ''
     : 'Loading users…'
 
   return (
     <main className="section">
-      <h1 className="section-title">Management console</h1>
-      <p className="section-subtitle">Moderation, curation, and ownership tools.</p>
+      <h1 className="section-title">{t('management.title')}</h1>
+      <p className="section-subtitle">{t('management.subtitle')}</p>
 
       <div className="card">
         <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-          Reported skills
+          {t('management.reportedSkills')}
         </h2>
         <div className="management-controls">
           <div className="management-control management-search">
-            <span className="mono">Filter</span>
+            <span className="mono">{t('management.filter')}</span>
             <input
               type="search"
-              placeholder="Search reported skills"
+              placeholder={t('management.searchReported')}
               value={reportSearch}
               onChange={(event) => setReportSearch(event.target.value)}
             />
@@ -233,9 +235,9 @@ function Management() {
                     </Link>
                     <div className="section-subtitle" style={{ margin: 0 }}>
                       @{owner?.handle ?? owner?.name ?? 'user'} · v{latestVersion?.version ?? '—'} ·
-                      {skill.reportCount ?? 0} report{(skill.reportCount ?? 0) === 1 ? '' : 's'}
+                      {skill.reportCount ?? 0} {t('management.reports', { s: (skill.reportCount ?? 0) === 1 ? '' : 's' })}
                       {skill.lastReportedAt
-                        ? ` · last ${formatTimestamp(skill.lastReportedAt)}`
+                        ? ` · ${t('management.lastTime', { time: formatTimestamp(skill.lastReportedAt) })}`
                         : ''}
                     </div>
                     {reportEntries.length > 0 ? (
@@ -255,7 +257,7 @@ function Management() {
                       </div>
                     ) : (
                       <div className="section-subtitle" style={{ margin: 0 }}>
-                        No report reasons yet.
+                        {t('management.noReportReasons')}
                       </div>
                     )}
                   </div>
@@ -267,7 +269,7 @@ function Management() {
                         void setSoftDeleted({ skillId: skill._id, deleted: !skill.softDeletedAt })
                       }
                     >
-                      {skill.softDeletedAt ? 'Restore' : 'Hide'}
+                      {skill.softDeletedAt ? t('management.restore') : t('management.hide')}
                     </button>
                     {admin ? (
                       <button
@@ -278,7 +280,7 @@ function Management() {
                           void hardDelete({ skillId: skill._id })
                         }}
                       >
-                        Hard delete
+                        {t('management.hardDelete')}
                       </button>
                     ) : null}
                   </div>
@@ -291,23 +293,23 @@ function Management() {
 
       <div className="card" style={{ marginTop: 20 }}>
         <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-          Skill tools
+          {t('management.skillTools')}
         </h2>
         {selectedSlug ? (
           <div className="section-subtitle" style={{ marginTop: 8 }}>
-            Managing "{selectedSlug}" ·{' '}
+            {t('management.managing', { slug: selectedSlug ?? '' })} ·{' '}
             <Link to="/management" search={{ skill: undefined }}>
-              Clear selection
+              {t('management.clearSelection')}
             </Link>
           </div>
         ) : null}
         <div className="management-list">
           {!selectedSlug ? (
-            <div className="stat">Use the Manage button on a skill to open tooling here.</div>
+            <div className="stat">{t('management.useManageButton')}</div>
           ) : selectedSkill === undefined ? (
-            <div className="stat">Loading skill…</div>
+            <div className="stat">{t('management.loadingSkill')}</div>
           ) : !selectedSkill?.skill ? (
-            <div className="stat">No skill found for "{selectedSlug}".</div>
+            <div className="stat">{t('management.noSkillFound', { slug: selectedSlug ?? '' })}</div>
           ) : (
             (() => {
               const { skill, latestVersion, owner, canonical } = selectedSkill
@@ -349,7 +351,7 @@ function Management() {
                     ) : null}
                     <div className="management-controls">
                       <label className="management-control">
-                        <span className="mono">duplicate of</span>
+                        <span className="mono">{t('management.duplicateOf')}</span>
                         <input
                           className="search-input"
                           value={selectedDuplicate}
@@ -367,11 +369,11 @@ function Management() {
                           })
                         }
                       >
-                        Set duplicate
+                        {t('management.setDuplicate')}
                       </button>
                       {admin ? (
                         <label className="management-control">
-                          <span className="mono">owner</span>
+                          <span className="mono">{t('management.owner')}</span>
                           <select
                             value={selectedOwner}
                             onChange={(event) => setSelectedOwner(event.target.value)}
@@ -392,7 +394,7 @@ function Management() {
                               })
                             }
                           >
-                            Change owner
+                            {t('management.changeOwner')}
                           </button>
                         </label>
                       ) : null}
@@ -404,7 +406,7 @@ function Management() {
                       to="/$owner/$slug"
                       params={{ owner: ownerParam, slug: skill.slug }}
                     >
-                      View
+                      {t('management.view')}
                     </Link>
                     <button
                       className="btn"
@@ -413,7 +415,7 @@ function Management() {
                         void setSoftDeleted({ skillId: skill._id, deleted: !skill.softDeletedAt })
                       }
                     >
-                      {skill.softDeletedAt ? 'Restore' : 'Hide'}
+                      {skill.softDeletedAt ? t('management.restore') : t('management.hide')}
                     </button>
                     <button
                       className="btn"
@@ -425,7 +427,7 @@ function Management() {
                         })
                       }
                     >
-                      {isHighlighted ? 'Unhighlight' : 'Highlight'}
+                      {isHighlighted ? t('management.unhighlight') : t('management.highlight')}
                     </button>
                     {admin ? (
                       <button
@@ -446,7 +448,7 @@ function Management() {
                         disabled={!canBanOwner}
                         onClick={() => {
                           if (!ownerUserId || ownerUserId === me?._id) return
-                          if (!window.confirm(`Ban @${ownerHandle} and delete their skills?`)) {
+                          if (!window.confirm(t('management.banConfirm', { handle: ownerHandle }))) {
                             return
                           }
                           const reason = promptBanReason(`@${ownerHandle}`)
@@ -454,7 +456,7 @@ function Management() {
                           void banUser({ userId: ownerUserId, reason })
                         }}
                       >
-                        Ban user
+                        {t('management.banUser')}
                       </button>
                     ) : null}
                     {admin ? (
@@ -469,7 +471,7 @@ function Management() {
                             })
                           }
                         >
-                          {isOfficial ? 'Remove official' : 'Mark official'}
+                          {isOfficial ? t('management.removeOfficial') : t('management.markOfficial')}
                         </button>
                         <button
                           className="btn"
@@ -481,7 +483,7 @@ function Management() {
                             })
                           }
                         >
-                          {isDeprecated ? 'Remove deprecated' : 'Mark deprecated'}
+                          {isDeprecated ? t('management.removeDeprecated') : t('management.markDeprecated')}
                         </button>
                       </>
                     ) : null}
@@ -495,11 +497,11 @@ function Management() {
 
       <div className="card" style={{ marginTop: 20 }}>
         <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-          Duplicate candidates
+          {t('management.duplicateCandidates')}
         </h2>
         <div className="management-list">
           {duplicateCandidates.length === 0 ? (
-            <div className="stat">No duplicate candidates.</div>
+            <div className="stat">{t('management.noDuplicates')}</div>
           ) : (
             duplicateCandidates.map((entry) => (
               <div key={entry.skill._id} className="management-item">
@@ -543,7 +545,7 @@ function Management() {
                               slug: match.skill.slug,
                             }}
                           >
-                            View
+                            {t('management.view')}
                           </Link>
                           <button
                             className="btn"
@@ -555,7 +557,7 @@ function Management() {
                               })
                             }
                           >
-                            Mark duplicate
+                            {t('management.markDuplicate')}
                           </button>
                         </div>
                       </div>
@@ -574,7 +576,7 @@ function Management() {
                       slug: entry.skill.slug,
                     }}
                   >
-                    View
+                    {t('management.view')}
                   </Link>
                 </div>
               </div>
@@ -585,16 +587,16 @@ function Management() {
 
       <div className="card" style={{ marginTop: 20 }}>
         <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-          Recent pushes
+          {t('management.recentPushes')}
         </h2>
         <div className="management-list">
           {recentVersions.length === 0 ? (
-            <div className="stat">No recent versions.</div>
+            <div className="stat">{t('management.noRecentVersions')}</div>
           ) : (
             recentVersions.map((entry) => (
               <div key={entry.version._id} className="management-item">
                 <div className="management-item-main">
-                  <strong>{entry.skill?.displayName ?? 'Unknown skill'}</strong>
+                  <strong>{entry.skill?.displayName ?? t('management.unknownSkill')}</strong>
                   <div className="section-subtitle" style={{ margin: 0 }}>
                     v{entry.version.version} · @{entry.owner?.handle ?? entry.owner?.name ?? 'user'}
                   </div>
@@ -612,7 +614,7 @@ function Management() {
                         slug: entry.skill.slug,
                       }}
                     >
-                      View
+                      {t('management.view')}
                     </Link>
                   ) : null}
                 </div>
@@ -625,14 +627,14 @@ function Management() {
       {admin ? (
         <div className="card" style={{ marginTop: 20 }}>
           <h2 className="section-title" style={{ fontSize: '1.2rem', margin: 0 }}>
-            Users
+            {t('management.users')}
           </h2>
           <div className="management-controls">
             <div className="management-control management-search">
-              <span className="mono">Filter</span>
+              <span className="mono">{t('management.filter')}</span>
               <input
                 type="search"
-                placeholder="Search users"
+                placeholder={t('management.searchUsers')}
                 value={userSearch}
                 onChange={(event) => setUserSearch(event.target.value)}
               />
@@ -665,9 +667,9 @@ function Management() {
                         }
                       }}
                     >
-                      <option value="user">User</option>
-                      <option value="moderator">Moderator</option>
-                      <option value="admin">Admin</option>
+                      <option value="user">{t('management.user')}</option>
+                      <option value="moderator">{t('management.moderator')}</option>
+                      <option value="admin">{t('management.admin')}</option>
                     </select>
                     <button
                       className="btn"
@@ -677,7 +679,7 @@ function Management() {
                         if (user._id === me?._id) return
                         if (
                           !window.confirm(
-                            `Ban @${user.handle ?? user.name ?? 'user'} and delete their skills?`,
+                            t('management.banConfirm', { handle: user.handle ?? user.name ?? 'user' }),
                           )
                         ) {
                           return
@@ -688,7 +690,7 @@ function Management() {
                         void banUser({ userId: user._id, reason })
                       }}
                     >
-                      Ban user
+                      {t('management.banUser')}
                     </button>
                   </div>
                 </div>
diff --git a/src/routes/settings.tsx b/src/routes/settings.tsx
index 825e00e93f..de6b9608bc 100644
--- a/src/routes/settings.tsx
+++ b/src/routes/settings.tsx
@@ -3,6 +3,7 @@ import { useMutation, useQuery } from 'convex/react'
 import { useEffect, useState } from 'react'
 import { api } from '../../convex/_generated/api'
 import type { Id } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n'
 import { gravatarUrl } from '../lib/gravatar'
 
 export const Route = createFileRoute('/settings')({
@@ -10,6 +11,7 @@ export const Route = createFileRoute('/settings')({
 })
 
 function Settings() {
+  const { t } = useI18n()
   const me = useQuery(api.users.me)
   const updateProfile = useMutation(api.users.updateProfile)
   const deleteAccount = useMutation(api.users.deleteAccount)
@@ -40,7 +42,7 @@ function Settings() {
   if (!me) {
     return (
       <main className="section">
-        <div className="card">Sign in to access settings.</div>
+        <div className="card">{t('settings.signInRequired')}</div>
       </main>
     )
   }
@@ -52,7 +54,7 @@ function Settings() {
   async function onSave(event: React.FormEvent) {
     event.preventDefault()
     await updateProfile({ displayName, bio })
-    setStatus('Saved.')
+    setStatus(t('settings.saved'))
   }
 
   async function onDelete() {
@@ -65,14 +67,14 @@ function Settings() {
   }
 
   async function onCreateToken() {
-    const label = tokenLabel.trim() || 'CLI token'
+    const label = tokenLabel.trim() || t('settings.cliToken')
     const result = await createToken({ label })
     setNewToken(result.token)
   }
 
   return (
     <main className="section settings-shell">
-      <h1 className="section-title">Settings</h1>
+      <h1 className="section-title">{t('settings.title')}</h1>
       <div className="card settings-profile">
         <div className="settings-avatar">
           {avatar ? (
@@ -89,7 +91,7 @@ function Settings() {
       </div>
       <form className="card settings-card" onSubmit={onSave}>
         <label className="settings-field">
-          <span>Display name</span>
+          <span>{t('settings.displayName')}</span>
           <input
             className="settings-input"
             value={displayName}
@@ -97,18 +99,18 @@ function Settings() {
           />
         </label>
         <label className="settings-field">
-          <span>Bio</span>
+          <span>{t('settings.bio')}</span>
           <textarea
             className="settings-input"
             rows={5}
             value={bio}
             onChange={(event) => setBio(event.target.value)}
-            placeholder="Tell people what you're building."
+            placeholder={t('settings.bioPlaceholder')}
           />
         </label>
         <div className="settings-actions">
           <button className="btn btn-primary settings-save" type="submit">
-            Save
+            {t('settings.save')}
           </button>
           {status ? <div className="stat">{status}</div> : null}
         </div>
@@ -116,19 +118,19 @@ function Settings() {
 
       <div className="card settings-card">
         <h2 className="section-title danger-title" style={{ marginTop: 0 }}>
-          API tokens
+          {t('settings.apiTokens')}
         </h2>
         <p className="section-subtitle">
-          Use these tokens for the `clawhub` CLI. Tokens are shown once on creation.
+          {t('settings.apiTokensSubtitle')}
         </p>
 
         <div className="settings-field">
-          <span>Label</span>
+          <span>{t('settings.label')}</span>
           <input
             className="settings-input"
             value={tokenLabel}
             onChange={(event) => setTokenLabel(event.target.value)}
-            placeholder="CLI token"
+            placeholder={t('settings.cliToken')}
           />
         </div>
         <div className="settings-actions">
@@ -137,11 +139,11 @@ function Settings() {
             type="button"
             onClick={() => void onCreateToken()}
           >
-            Create token
+            {t('settings.createToken')}
           </button>
           {newToken ? (
             <div className="stat" style={{ overflowX: 'auto' }}>
-              <div style={{ marginBottom: 8 }}>Copy this token now:</div>
+              <div style={{ marginBottom: 8 }}>{t('settings.copyTokenNow')}</div>
               <code>{newToken}</code>
             </div>
           ) : null}
@@ -161,9 +163,9 @@ function Settings() {
                     <span style={{ opacity: 0.7 }}>({token.prefix}…)</span>
                   </div>
                   <div style={{ opacity: 0.7 }}>
-                    Created {formatDate(token.createdAt)}
-                    {token.lastUsedAt ? ` · Used ${formatDate(token.lastUsedAt)}` : ''}
-                    {token.revokedAt ? ` · Revoked ${formatDate(token.revokedAt)}` : ''}
+                    {t('settings.created')} {formatDate(token.createdAt)}
+                    {token.lastUsedAt ? ` · ${t('settings.used')} ${formatDate(token.lastUsedAt)}` : ''}
+                    {token.revokedAt ? ` · ${t('settings.revoked')} ${formatDate(token.revokedAt)}` : ''}
                   </div>
                 </div>
                 <div>
@@ -173,7 +175,7 @@ function Settings() {
                     disabled={Boolean(token.revokedAt)}
                     onClick={() => void revokeToken({ tokenId: token._id })}
                   >
-                    {token.revokedAt ? 'Revoked' : 'Revoke'}
+                    {token.revokedAt ? t('settings.revoked') : t('settings.revoke')}
                   </button>
                 </div>
               </div>
@@ -181,18 +183,18 @@ function Settings() {
           </div>
         ) : (
           <p className="section-subtitle" style={{ marginTop: 16 }}>
-            No tokens yet.
+            {t('settings.noTokens')}
           </p>
         )}
       </div>
 
       <div className="card danger-card">
-        <h2 className="section-title danger-title">Danger zone</h2>
+        <h2 className="section-title danger-title">{t('settings.dangerZone')}</h2>
         <p className="section-subtitle">
-          Delete your account permanently. This cannot be undone. Published skills remain public.
+          {t('settings.dangerText')}
         </p>
         <button className="btn btn-danger" type="button" onClick={() => void onDelete()}>
-          Delete account
+          {t('settings.deleteAccount')}
         </button>
       </div>
     </main>
diff --git a/src/routes/skills/-SkillsResults.tsx b/src/routes/skills/-SkillsResults.tsx
index 7ed91a1700..76c38d372c 100644
--- a/src/routes/skills/-SkillsResults.tsx
+++ b/src/routes/skills/-SkillsResults.tsx
@@ -3,6 +3,7 @@ import type { RefObject } from 'react'
 import { SkillCard } from '../../components/SkillCard'
 import { SkillMetricsRow, SkillStatsTripletLine } from '../../components/SkillStats'
 import { UserBadge } from '../../components/UserBadge'
+import { useI18n } from '../../i18n'
 import { getPlatformLabels } from '../../components/skillDetailUtils'
 import { getSkillBadges } from '../../lib/badges'
 import { buildSkillHref, type SkillListEntry } from './-types'
@@ -32,17 +33,18 @@ export function SkillsResults({
   loadMoreRef,
   loadMore,
 }: SkillsResultsProps) {
+  const { t } = useI18n()
   return (
     <>
       {isLoadingSkills ? (
         <div className="card">
-          <div className="loading-indicator">Loading skills…</div>
+          <div className="loading-indicator">{t('skillsResults.loading')}</div>
         </div>
       ) : sorted.length === 0 ? (
         <div className="card">
           {paginationStatus === 'Exhausted' || hasQuery
-            ? 'No skills match that filter.'
-            : 'Loading skills…'}
+            ? t('skillsResults.noMatch')
+            : t('skillsResults.loading')}
         </div>
       ) : view === 'cards' ? (
         <div className="grid">
@@ -59,12 +61,12 @@ export function SkillsResults({
                 skill={skill}
                 href={skillHref}
                 badge={getSkillBadges(skill)}
-                chip={isPlugin ? 'Plugin bundle (nix)' : undefined}
+                chip={isPlugin ? t('skillsResults.pluginBundle') : undefined}
                 platformLabels={platforms.length ? platforms : undefined}
-                summaryFallback="Agent-ready skill pack."
+                summaryFallback={t('skillsResults.agentReady')}
                 meta={
                   <div className="skill-card-footer-rows">
-                    <UserBadge user={entry.owner} fallbackHandle={ownerHandle} prefix="by" link={false} />
+                    <UserBadge user={entry.owner} fallbackHandle={ownerHandle} prefix={t('userBadge.by')} link={false} />
                     <div className="stat">
                       <SkillStatsTripletLine stats={skill.stats} />
                     </div>
@@ -94,14 +96,14 @@ export function SkillsResults({
                         {badge}
                       </span>
                     ))}
-                    {isPlugin ? <span className="tag tag-accent tag-compact">Plugin bundle (nix)</span> : null}
+                    {isPlugin ? <span className="tag tag-accent tag-compact">{t('skillsResults.pluginBundle')}</span> : null}
                     {platforms.map((label) => (
                       <span key={label} className="tag tag-compact">{label}</span>
                     ))}
                   </div>
-                  <div className="skills-row-summary">{skill.summary ?? 'No summary provided.'}</div>
+                  <div className="skills-row-summary">{skill.summary ?? t('skillsResults.noSummary')}</div>
                   <div className="skills-row-owner">
-                    <UserBadge user={entry.owner} fallbackHandle={ownerHandle} prefix="by" link={false} />
+                    <UserBadge user={entry.owner} fallbackHandle={ownerHandle} prefix={t('userBadge.by')} link={false} />
                   </div>
                 </div>
                 <div className="skills-row-metrics">
@@ -121,13 +123,13 @@ export function SkillsResults({
         >
           {canAutoLoad ? (
             isLoadingMore ? (
-              'Loading more…'
+              t('skillsResults.loadingMore')
             ) : (
-              'Scroll to load more'
+              t('skillsResults.scrollToLoad')
             )
           ) : (
             <button className="btn" type="button" onClick={loadMore} disabled={isLoadingMore}>
-              {isLoadingMore ? 'Loading…' : 'Load more'}
+              {isLoadingMore ? t('skillsResults.loadingEllipsis') : t('skillsResults.loadMore')}
             </button>
           )}
         </div>
diff --git a/src/routes/skills/-SkillsToolbar.tsx b/src/routes/skills/-SkillsToolbar.tsx
index 82ef04d1b4..39a85168e5 100644
--- a/src/routes/skills/-SkillsToolbar.tsx
+++ b/src/routes/skills/-SkillsToolbar.tsx
@@ -1,4 +1,5 @@
 import type { RefObject } from 'react'
+import { useI18n } from '../../i18n'
 import { type SortDir, type SortKey } from './-params'
 
 type SkillsToolbarProps = {
@@ -34,6 +35,7 @@ export function SkillsToolbar({
   onToggleDir,
   onToggleView,
 }: SkillsToolbarProps) {
+  const { t } = useI18n()
   return (
     <div className="skills-toolbar">
       <div className="skills-search">
@@ -42,7 +44,7 @@ export function SkillsToolbar({
           className="skills-search-input"
           value={query}
           onChange={(event) => onQueryChange(event.target.value)}
-          placeholder="Filter by name, slug, or summary…"
+          placeholder={t('skillsToolbar.filterPlaceholder')}
         />
       </div>
       <div className="skills-toolbar-row">
@@ -52,7 +54,7 @@ export function SkillsToolbar({
           aria-pressed={highlightedOnly}
           onClick={onToggleHighlighted}
         >
-          Highlighted
+          {t('skillsToolbar.highlighted')}
         </button>
         <button
           className={`search-filter-button${nonSuspiciousOnly ? ' is-active' : ''}`}
@@ -60,7 +62,7 @@ export function SkillsToolbar({
           aria-pressed={nonSuspiciousOnly}
           onClick={onToggleNonSuspicious}
         >
-          Hide suspicious
+          {t('skillsToolbar.hideSuspicious')}
         </button>
         <select
           className="skills-sort"
@@ -68,15 +70,15 @@ export function SkillsToolbar({
           onChange={(event) => onSortChange(event.target.value)}
           aria-label="Sort skills"
         >
-          {hasQuery ? <option value="relevance">Relevance</option> : null}
-          <option value="newest">Newest</option>
-          <option value="updated">Recently updated</option>
-          <option value="downloads">Downloads</option>
-          <option value="installs">Installs</option>
-          <option value="stars">Stars</option>
-          <option value="name">Name</option>
+          {hasQuery ? <option value="relevance">{t('skillsToolbar.relevance')}</option> : null}
+          <option value="newest">{t('skillsToolbar.newest')}</option>
+          <option value="updated">{t('skillsToolbar.recentlyUpdated')}</option>
+          <option value="downloads">{t('skillsToolbar.downloads')}</option>
+          <option value="installs">{t('skillsToolbar.installs')}</option>
+          <option value="stars">{t('skillsToolbar.stars')}</option>
+          <option value="name">{t('skillsToolbar.name')}</option>
         </select>
-        <button className="skills-dir" type="button" aria-label={`Sort direction ${dir}`} onClick={onToggleDir}>
+        <button className="skills-dir" type="button" aria-label={t('skillsToolbar.sortDirection')} onClick={onToggleDir}>
           {dir === 'asc' ? '↑' : '↓'}
         </button>
         <button
@@ -84,7 +86,7 @@ export function SkillsToolbar({
           type="button"
           onClick={onToggleView}
         >
-          {view === 'cards' ? 'List' : 'Cards'}
+          {view === 'cards' ? t('skillsToolbar.list') : t('skillsToolbar.cards')}
         </button>
       </div>
     </div>
diff --git a/src/routes/skills/index.tsx b/src/routes/skills/index.tsx
index 9abb0d6fcf..3362d459e8 100644
--- a/src/routes/skills/index.tsx
+++ b/src/routes/skills/index.tsx
@@ -1,6 +1,7 @@
 import { createFileRoute, redirect } from '@tanstack/react-router'
 import { useQuery } from 'convex/react'
 import { useRef } from 'react'
+import { useI18n } from '../../i18n/useI18n'
 import { api } from '../../../convex/_generated/api'
 import { parseSort } from './-params'
 import { SkillsResults } from './-SkillsResults'
@@ -48,6 +49,7 @@ export const Route = createFileRoute('/skills/')({
 })
 
 export function SkillsIndex() {
+  const { t } = useI18n()
   const navigate = Route.useNavigate()
   const search = Route.useSearch()
   const searchInputRef = useRef<HTMLInputElement>(null)
@@ -65,13 +67,13 @@ export function SkillsIndex() {
     <main className="section">
       <header className="skills-header-top">
         <h1 className="section-title" style={{ marginBottom: 8 }}>
-          Skills
+          {t('skillsIndex.title')}
           {totalSkillsText && <span style={{ opacity: 0.55 }}>{` (${totalSkillsText})`}</span>}
         </h1>
         <p className="section-subtitle" style={{ marginBottom: 0 }}>
           {model.isLoadingSkills
-            ? 'Loading skills…'
-            : `Browse the skill library${model.activeFilters.length ? ` (${model.activeFilters.join(', ')})` : ''}.`}
+            ? t('skillsIndex.loading')
+            : `${t('skillsIndex.browseLibrary')}${model.activeFilters.length ? ` (${model.activeFilters.join(', ')})` : ''}`}
         </p>
       </header>
       <div className="skills-container">
diff --git a/src/routes/souls/index.tsx b/src/routes/souls/index.tsx
index 7d638ad792..ba6b441b90 100644
--- a/src/routes/souls/index.tsx
+++ b/src/routes/souls/index.tsx
@@ -4,6 +4,7 @@ import { useEffect, useMemo, useRef, useState } from 'react'
 import { api } from '../../../convex/_generated/api'
 import { SoulMetricsRow, SoulStatsTripletLine } from '../../components/SoulStats'
 import { SoulCard } from '../../components/SoulCard'
+import { useI18n } from '../../i18n/useI18n'
 import type { PublicSoul } from '../../lib/publicUser'
 
 const sortKeys = ['newest', 'downloads', 'stars', 'name', 'updated'] as const
@@ -35,6 +36,7 @@ export const Route = createFileRoute('/souls/')({
 })
 
 function SoulsIndex() {
+  const { t } = useI18n()
   const navigate = Route.useNavigate()
   const search = Route.useSearch()
   const sort = search.sort ?? 'newest'
@@ -109,12 +111,12 @@ function SoulsIndex() {
       <header className="skills-header">
         <div>
           <h1 className="section-title" style={{ marginBottom: 8 }}>
-            Souls
+            {t('soulsIndex.title')}
           </h1>
           <p className="section-subtitle" style={{ marginBottom: 0 }}>
             {isLoadingSouls
-              ? 'Loading souls…'
-              : `${showing}${typeof total === 'number' ? ` of ${total}` : ''} souls.`}
+              ? t('soulsIndex.loadingSubtitle')
+              : t('soulsIndex.showingCount', { showing: String(showing), total: String(total ?? '') })}
           </p>
         </div>
         <div className="skills-toolbar">
@@ -132,7 +134,7 @@ function SoulsIndex() {
                   replace: true,
                 })
               }}
-              placeholder="Filter by name, slug, or summary…"
+              placeholder={t('soulsIndex.filterPlaceholder')}
             />
           </div>
           <div className="skills-toolbar-row">
@@ -150,18 +152,18 @@ function SoulsIndex() {
                   replace: true,
                 })
               }}
-              aria-label="Sort souls"
+              aria-label={t('soulsIndex.sortSouls')}
             >
-              <option value="newest">Newest</option>
-              <option value="updated">Recently updated</option>
-              <option value="downloads">Downloads</option>
-              <option value="stars">Stars</option>
-              <option value="name">Name</option>
+              <option value="newest">{t('soulsIndex.newest')}</option>
+              <option value="updated">{t('soulsIndex.recentlyUpdated')}</option>
+              <option value="downloads">{t('soulsIndex.downloads')}</option>
+              <option value="stars">{t('soulsIndex.stars')}</option>
+              <option value="name">{t('soulsIndex.name')}</option>
             </select>
             <button
               className="skills-dir"
               type="button"
-              aria-label={`Sort direction ${dir}`}
+              aria-label={t('soulsIndex.sortDirection', { dir })}
               onClick={() => {
                 void navigate({
                   search: (prev) => ({
@@ -187,7 +189,7 @@ function SoulsIndex() {
                 })
               }}
             >
-              {view === 'cards' ? 'List' : 'Cards'}
+              {view === 'cards' ? t('soulsIndex.list') : t('soulsIndex.cards')}
             </button>
           </div>
         </div>
@@ -195,17 +197,17 @@ function SoulsIndex() {
 
       {isLoadingSouls ? (
         <div className="card">
-          <div className="loading-indicator">Loading souls…</div>
+          <div className="loading-indicator">{t('soulsIndex.loadingSubtitle')}</div>
         </div>
       ) : showing === 0 ? (
-        <div className="card">No souls match that filter.</div>
+        <div className="card">{t('soulsIndex.noMatch')}</div>
       ) : view === 'cards' ? (
         <div className="grid">
           {sorted.map((soul) => (
             <SoulCard
               key={soul._id}
               soul={soul}
-              summaryFallback="A SOUL.md bundle."
+              summaryFallback={t('soulsIndex.soulBundle')}
               meta={
                 <div className="stat">
                   <SoulStatsTripletLine stats={soul.stats} />
@@ -228,7 +230,7 @@ function SoulsIndex() {
                   <span>{soul.displayName}</span>
                   <span className="skills-row-slug">/{soul.slug}</span>
                 </div>
-                <div className="skills-row-summary">{soul.summary ?? 'SOUL.md bundle.'}</div>
+                <div className="skills-row-summary">{soul.summary ?? t('soulsIndex.soulBundleAlt')}</div>
               </div>
               <div className="skills-row-metrics">
                 <SoulMetricsRow stats={soul.stats} />
diff --git a/src/routes/stars.tsx b/src/routes/stars.tsx
index 2440454679..c45d027fb2 100644
--- a/src/routes/stars.tsx
+++ b/src/routes/stars.tsx
@@ -2,6 +2,7 @@ import { createFileRoute, Link } from '@tanstack/react-router'
 import { useMutation, useQuery } from 'convex/react'
 import { api } from '../../convex/_generated/api'
 import type { Doc } from '../../convex/_generated/dataModel'
+import { useI18n } from '../i18n'
 import { formatCompactStat } from '../lib/numberFormat'
 import type { PublicSkill } from '../lib/publicUser'
 
@@ -10,6 +11,7 @@ export const Route = createFileRoute('/stars')({
 })
 
 function Stars() {
+  const { t } = useI18n()
   const me = useQuery(api.users.me) as Doc<'users'> | null | undefined
   const skills =
     (useQuery(api.stars.listByUser, me ? { userId: me._id, limit: 50 } : 'skip') as
@@ -21,18 +23,18 @@ function Stars() {
   if (!me) {
     return (
       <main className="section">
-        <div className="card">Sign in to see your highlights.</div>
+        <div className="card">{t('stars.signInRequired')}</div>
       </main>
     )
   }
 
   return (
     <main className="section">
-      <h1 className="section-title">Your highlights</h1>
-      <p className="section-subtitle">Skills you’ve starred for quick access.</p>
+      <h1 className="section-title">{t('stars.title')}</h1>
+      <p className="section-subtitle">{t('stars.subtitle')}</p>
       <div className="grid">
         {skills.length === 0 ? (
-          <div className="card">No stars yet.</div>
+          <div className="card">{t('stars.noStars')}</div>
         ) : (
           skills.map((skill) => {
             const owner = encodeURIComponent(String(skill.ownerUserId))
diff --git a/src/routes/u/$handle.tsx b/src/routes/u/$handle.tsx
index ea10eec824..88fd59db6d 100644
--- a/src/routes/u/$handle.tsx
+++ b/src/routes/u/$handle.tsx
@@ -5,6 +5,7 @@ import { api } from '../../../convex/_generated/api'
 import type { Doc } from '../../../convex/_generated/dataModel'
 import { SkillCard } from '../../components/SkillCard'
 import { SkillStatsTripletLine } from '../../components/SkillStats'
+import { useI18n } from '../../i18n/useI18n'
 import { getSkillBadges } from '../../lib/badges'
 import type { PublicSkill, PublicUser } from '../../lib/publicUser'
 
@@ -13,6 +14,7 @@ export const Route = createFileRoute('/u/$handle')({
 })
 
 function UserProfile() {
+  const { t } = useI18n()
   const { handle } = Route.useParams()
   const me = useQuery(api.users.me) as Doc<'users'> | null | undefined
   const user = useQuery(api.users.getByHandle, { handle }) as PublicUser | null | undefined
@@ -41,7 +43,7 @@ function UserProfile() {
     return (
       <main className="section">
         <div className="card">
-          <div className="loading-indicator">Loading user…</div>
+          <div className="loading-indicator">{t('userProfile.loading')}</div>
         </div>
       </main>
     )
@@ -50,7 +52,7 @@ function UserProfile() {
   if (user === null) {
     return (
       <main className="section">
-        <div className="card">User not found.</div>
+        <div className="card">{t('userProfile.notFound')}</div>
       </main>
     )
   }
@@ -77,7 +79,7 @@ function UserProfile() {
       </div>
 
       {isSelf ? (
-        <div className="profile-tabs" role="tablist" aria-label="Profile tabs">
+        <div className="profile-tabs" role="tablist" aria-label={t('userProfile.profileTabs')}>
           <button
             className={tab === 'stars' ? 'profile-tab is-active' : 'profile-tab'}
             type="button"
@@ -85,7 +87,7 @@ function UserProfile() {
             aria-selected={tab === 'stars'}
             onClick={() => setTab('stars')}
           >
-            Stars
+            {t('userProfile.starsTab')}
           </button>
           <button
             className={tab === 'installed' ? 'profile-tab is-active' : 'profile-tab'}
@@ -94,7 +96,7 @@ function UserProfile() {
             aria-selected={tab === 'installed'}
             onClick={() => setTab('installed')}
           >
-            Installed
+            {t('userProfile.installedTab')}
           </button>
         </div>
       ) : null}
@@ -108,13 +110,13 @@ function UserProfile() {
       ) : (
         <>
           <h2 className="section-title" style={{ fontSize: '1.3rem' }}>
-            Published
+            {t('userProfile.published')}
           </h2>
-          <p className="section-subtitle">Skills published by this user.</p>
+          <p className="section-subtitle">{t('userProfile.publishedSubtitle')}</p>
 
           {isLoadingPublished ? (
             <div className="card">
-              <div className="loading-indicator">Loading published skills…</div>
+              <div className="loading-indicator">{t('userProfile.loadingPublished')}</div>
             </div>
           ) : published.length > 0 ? (
             <div className="grid" style={{ marginBottom: 18 }}>
@@ -123,7 +125,7 @@ function UserProfile() {
                   key={skill._id}
                   skill={skill}
                   badge={getSkillBadges(skill)}
-                  summaryFallback="Agent-ready skill pack."
+                  summaryFallback={t('userProfile.agentReady')}
                   meta={
                     <div className="stat">
                       <SkillStatsTripletLine stats={skill.stats} />
@@ -135,16 +137,16 @@ function UserProfile() {
           ) : null}
 
           <h2 className="section-title" style={{ fontSize: '1.3rem' }}>
-            Stars
+            {t('userProfile.starsTitle')}
           </h2>
-          <p className="section-subtitle">Skills this user has starred.</p>
+          <p className="section-subtitle">{t('userProfile.starsSubtitle')}</p>
 
           {isLoadingSkills ? (
             <div className="card">
-              <div className="loading-indicator">Loading stars…</div>
+              <div className="loading-indicator">{t('userProfile.loadingStars')}</div>
             </div>
           ) : skills.length === 0 ? (
-            <div className="card">No stars yet.</div>
+            <div className="card">{t('userProfile.noStars')}</div>
           ) : (
             <div className="grid">
               {skills.map((skill) => (
@@ -152,7 +154,7 @@ function UserProfile() {
                   key={skill._id}
                   skill={skill}
                   badge={getSkillBadges(skill)}
-                  summaryFallback="Agent-ready skill pack."
+                  summaryFallback={t('userProfile.agentReady')}
                   meta={
                     <div className="stat">
                       <SkillStatsTripletLine stats={skill.stats} />
@@ -173,6 +175,7 @@ function InstalledSection(props: {
   onToggleRemoved: () => void
   data: TelemetryResponse | null | undefined
 }) {
+  const { t } = useI18n()
   const clearTelemetry = useMutation(api.telemetry.clearMyTelemetry)
   const [showRaw, setShowRaw] = useState(false)
   const data = props.data
@@ -180,7 +183,7 @@ function InstalledSection(props: {
     return (
       <>
         <h2 className="section-title" style={{ fontSize: '1.3rem' }}>
-          Installed
+          {t('userProfile.installed')}
         </h2>
         <div className="card">
           <div className="loading-indicator">Loading telemetry…</div>
@@ -193,7 +196,7 @@ function InstalledSection(props: {
     return (
       <>
         <h2 className="section-title" style={{ fontSize: '1.3rem' }}>
-          Installed
+          {t('userProfile.installed')}
         </h2>
         <div className="card">Sign in to view your installed skills.</div>
       </>
@@ -203,28 +206,27 @@ function InstalledSection(props: {
   return (
     <>
       <h2 className="section-title" style={{ fontSize: '1.3rem' }}>
-        Installed
+        {t('userProfile.installed')}
       </h2>
       <p className="section-subtitle" style={{ maxWidth: 760 }}>
-        Private view. Only you can see your folders/roots. Everyone else only sees aggregated
-        install counts per skill.
+        {t('userProfile.installedSubtitle')}
       </p>
       <div className="profile-actions">
         <button className="btn" type="button" onClick={props.onToggleRemoved}>
-          {props.includeRemoved ? 'Hide removed' : 'Show removed'}
+          {props.includeRemoved ? t('userProfile.hideRemoved') : t('userProfile.showRemoved')}
         </button>
         <button className="btn" type="button" onClick={() => setShowRaw((value) => !value)}>
-          {showRaw ? 'Hide JSON' : 'Show JSON'}
+          {showRaw ? t('userProfile.hideJson') : t('userProfile.showJson')}
         </button>
         <button
           className="btn"
           type="button"
           onClick={() => {
-            if (!window.confirm('Delete all telemetry data?')) return
+            if (!window.confirm(t('userProfile.deleteTelemetryConfirm'))) return
             void clearTelemetry()
           }}
         >
-          Delete telemetry
+          {t('userProfile.deleteTelemetry')}
         </button>
       </div>
 
@@ -237,7 +239,7 @@ function InstalledSection(props: {
       ) : null}
 
       {data.roots.length === 0 ? (
-        <div className="card">No telemetry yet. Run `clawhub sync` from the CLI.</div>
+        <div className="card">{t('userProfile.noTelemetry')}</div>
       ) : (
         <div style={{ display: 'grid', gap: 16 }}>
           {data.roots.map((root) => (
@@ -246,14 +248,14 @@ function InstalledSection(props: {
                 <div>
                   <div className="telemetry-root-title">{root.label}</div>
                   <div className="telemetry-root-meta">
-                    Last sync {new Date(root.lastSeenAt).toLocaleString()}
-                    {root.expiredAt ? ' · stale' : ''}
+                    {t('userProfile.lastSync', { date: new Date(root.lastSeenAt).toLocaleString() })}
+                    {root.expiredAt ? ` · ${t('userProfile.stale')}` : ''}
                   </div>
                 </div>
-                <div className="tag">{root.skills.length} skills</div>
+                <div className="tag">{t('userProfile.skillsCount', { count: String(root.skills.length) })}</div>
               </div>
               {root.skills.length === 0 ? (
-                <div className="stat">No skills found in this root.</div>
+                <div className="stat">{t('userProfile.noSkillsInRoot')}</div>
               ) : (
                 <div className="telemetry-skill-list">
                   {root.skills.map((entry) => (
@@ -267,7 +269,7 @@ function InstalledSection(props: {
                       </a>
                       <div className="telemetry-skill-meta mono">
                         {entry.lastVersion ? `v${entry.lastVersion}` : 'v?'}{' '}
-                        {entry.removedAt ? '· removed' : ''}
+                        {entry.removedAt ? `· ${t('userProfile.removed')}` : ''}
                       </div>
                     </div>
                   ))}
diff --git a/src/routes/upload.tsx b/src/routes/upload.tsx
index 8a4ac18772..6523886d74 100644
--- a/src/routes/upload.tsx
+++ b/src/routes/upload.tsx
@@ -8,6 +8,7 @@ import { useAction, useMutation, useQuery } from 'convex/react'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import semver from 'semver'
 import { api } from '../../convex/_generated/api'
+import { useI18n } from '../i18n'
 import { getPublicSlugCollision } from '../lib/slugCollision'
 import { getSiteMode } from '../lib/site'
 import { expandDroppedItems, expandFilesWithReport } from '../lib/uploadFiles'
@@ -31,6 +32,7 @@ export const Route = createFileRoute('/upload')({
 })
 
 export function Upload() {
+  const { t } = useI18n()
   const { isAuthenticated, me } = useAuthStatus()
   const { updateSlug } = useSearch({ from: '/upload' })
   const siteMode = getSiteMode()
@@ -235,39 +237,39 @@ export function Upload() {
   const validation = useMemo(() => {
     const issues: string[] = []
     if (!trimmedSlug) {
-      issues.push('Slug is required.')
+      issues.push(t('upload.slugRequired'))
     } else if (!SLUG_PATTERN.test(trimmedSlug)) {
-      issues.push('Slug must be lowercase and use dashes only.')
+      issues.push(t('upload.slugFormat'))
     }
     if (!trimmedName) {
-      issues.push('Display name is required.')
+      issues.push(t('upload.displayNameRequired'))
     }
     if (!semver.valid(version)) {
-      issues.push('Version must be valid semver (e.g. 1.0.0).')
+      issues.push(t('upload.versionFormat'))
     }
     if (parsedTags.length === 0) {
-      issues.push('At least one tag is required.')
+      issues.push(t('upload.tagRequired'))
     }
     if (!isSoulMode && !acceptedLicenseTerms) {
-      issues.push('Accept the MIT-0 license terms to publish this skill.')
+      issues.push(t('common.acceptLicense'))
     }
     if (files.length === 0) {
-      issues.push('Add at least one file.')
+      issues.push(t('upload.addFile'))
     }
     if (!hasRequiredFile) {
-      issues.push(`${requiredFileLabel} is required.`)
+      issues.push(t('upload.requiredFile', { requiredFileLabel }))
     }
     const invalidFiles = files.filter((file) => !isTextFile(file))
     if (invalidFiles.length > 0) {
       issues.push(
-        `Remove non-text files: ${invalidFiles
+        t('upload.removeNonText', { files: invalidFiles
           .slice(0, 3)
           .map((file) => file.name)
-          .join(', ')}`,
+          .join(', ') }),
       )
     }
     if (totalBytes > maxBytes) {
-      issues.push('Total file size exceeds 50MB.')
+      issues.push(t('upload.totalSizeExceeds'))
     }
     if (slugCollision) {
       issues.push(slugCollision.message)
@@ -296,7 +298,7 @@ export function Upload() {
   if (!isAuthenticated) {
     return (
       <main className="section">
-        <div className="card">Sign in to upload a {contentLabel}.</div>
+        <div className="card">{t('upload.signInRequired', { contentLabel })}</div>
       </main>
     )
   }
@@ -321,19 +323,19 @@ export function Upload() {
       return
     }
     if (!isSoulMode && !acceptedLicenseTerms) {
-      setError('Accept the MIT-0 license terms to publish this skill.')
+      setError(t('common.acceptLicense'))
       return
     }
     setError(null)
     if (totalBytes > maxBytes) {
-      setError('Total size exceeds 50MB per version.')
+      setError(t('upload.totalSizeError'))
       return
     }
     if (!hasRequiredFile) {
-      setError(`${requiredFileLabel} is required.`)
+      setError(t('upload.requiredFile', { requiredFileLabel }))
       return
     }
-    setStatus('Uploading files…')
+    setStatus(t('upload.uploadingFiles'))
 
     const uploaded = [] as Array<{
       path: string
@@ -361,7 +363,7 @@ export function Upload() {
       })
     }
 
-    setStatus('Publishing…')
+    setStatus(t('upload.publishing'))
     try {
       const result = await publishVersion({
         slug: trimmedSlug,
@@ -393,9 +395,9 @@ export function Upload() {
     <main className="section upload-page">
       <header className="upload-page-header">
         <div>
-          <h1 className="upload-page-title">Publish a {contentLabel}</h1>
+          <h1 className="upload-page-title">{t('upload.publishTitle', { contentLabel })}</h1>
           <p className="upload-page-subtitle">
-            Drop a folder with {requiredFileLabel} and text files. We will handle the rest.
+            {t('upload.dropInstruction', { requiredFileLabel })}
           </p>
         </div>
       </header>
@@ -403,47 +405,47 @@ export function Upload() {
       <form onSubmit={handleSubmit} className="upload-grid">
         <div className="card upload-panel">
           <label className="form-label" htmlFor="slug">
-            Slug
+            {t('upload.slug')}
           </label>
           <input
             className="form-input"
             id="slug"
             value={slug}
             onChange={(event) => setSlug(event.target.value)}
-            placeholder={`${contentLabel}-name`}
+            placeholder={t('upload.slugPlaceholder', { contentLabel })}
           />
 
           <label className="form-label" htmlFor="displayName">
-            Display name
+            {t('upload.displayName')}
           </label>
           <input
             className="form-input"
             id="displayName"
             value={displayName}
             onChange={(event) => setDisplayName(event.target.value)}
-            placeholder={`My ${contentLabel}`}
+            placeholder={t('upload.displayNamePlaceholder', { contentLabel })}
           />
 
           <label className="form-label" htmlFor="version">
-            Version
+            {t('upload.version')}
           </label>
           <input
             className="form-input"
             id="version"
             value={version}
             onChange={(event) => setVersion(event.target.value)}
-            placeholder="1.0.0"
+            placeholder={t('upload.versionPlaceholder')}
           />
 
           <label className="form-label" htmlFor="tags">
-            Tags
+            {t('upload.tags')}
           </label>
           <input
             className="form-input"
             id="tags"
             value={tags}
             onChange={(event) => setTags(event.target.value)}
-            placeholder="latest, stable"
+            placeholder={t('upload.tagsPlaceholder')}
           />
         </div>
 
@@ -481,27 +483,27 @@ export function Upload() {
             />
             <div className="upload-dropzone-copy">
               <div className="upload-dropzone-title-row">
-                <strong>Drop a folder</strong>
+                <strong>{t('upload.dropFolder')}</strong>
                 <span className="upload-dropzone-count">
-                  {files.length} files · {sizeLabel}
+                  {t('upload.filesCount', { count: files.length, sizeLabel })}
                 </span>
               </div>
               <span className="upload-dropzone-hint">
-                We keep folder paths and flatten the outer wrapper automatically.
+                {t('upload.flattenHint')}
               </span>
               <button
                 className="btn upload-picker-btn"
                 type="button"
                 onClick={() => fileInputRef.current?.click()}
               >
-                Choose folder
+                {t('upload.chooseFolder')}
               </button>
             </div>
           </label>
 
           <div className="upload-file-list">
             {files.length === 0 ? (
-              <div className="stat">No files selected.</div>
+              <div className="stat">{t('upload.noFiles')}</div>
             ) : (
               normalizedPaths.map((path) => (
                 <div key={path} className="upload-file-row">
@@ -514,7 +516,7 @@ export function Upload() {
         </div>
 
         <div className="card upload-panel" ref={validationRef}>
-          <h2 className="upload-panel-title">Validation</h2>
+          <h2 className="upload-panel-title">{t('upload.validation')}</h2>
           {validation.issues.length === 0 ? (
             <div className="stat">All checks passed.</div>
           ) : (
diff --git a/src/routes/upload/-utils.ts b/src/routes/upload/-utils.ts
index e19f2f3c61..658ae2196a 100644
--- a/src/routes/upload/-utils.ts
+++ b/src/routes/upload/-utils.ts
@@ -1,4 +1,5 @@
 import { isTextContentType, TEXT_FILE_EXTENSION_SET } from 'clawhub-schema'
+import { t } from '../../i18n'
 import { getUserFacingConvexError } from '../../lib/convexError'
 
 export async function uploadFile(uploadUrl: string, file: File) {
@@ -39,7 +40,7 @@ export function formatBytes(bytes: number) {
 }
 
 export function formatPublishError(error: unknown) {
-  return getUserFacingConvexError(error, 'Publish failed. Please try again.')
+  return getUserFacingConvexError(error, t('common.publishFailed'))
 }
 
 export function isTextFile(file: File) {