diff --git a/themes/fukasawa/components/Catalog.js b/themes/fukasawa/components/Catalog.js
index cad8ce68..500fa909 100644
--- a/themes/fukasawa/components/Catalog.js
+++ b/themes/fukasawa/components/Catalog.js
@@ -1,6 +1,7 @@
 import React, { useRef } from 'react'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
+import { useGlobal } from '@/lib/global'
 
 /**
  * 目录导航组件
@@ -9,10 +10,8 @@ import { uuidToId } from 'notion-utils'
  * @constructor
  */
 const Catalog = ({ toc }) => {
-  // 无目录就直接返回空
-  if (!toc || toc.length < 1) {
-    return <></>
-  }
+  const { locale } = useGlobal()
+
   // 监听滚动事件
   React.useEffect(() => {
     window.addEventListener('scroll', actionSectionScrollSpy)
@@ -56,8 +55,13 @@ const Catalog = ({ toc }) => {
     tRef?.current?.scrollTo({ top: 28 * index, behavior: 'smooth' })
   }, throttleMs))
 
+  // 无目录就直接返回空
+  if (!toc || toc.length < 1) {
+    return <></>
+  }
+
   return <div>
-    <div className='w-full dark:text-gray-300 mb-2'><i className='mr-1 fas fa-stream' /> 目录</div>
+    <div className='w-full dark:text-gray-300 mb-2'><i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}</div>
     <div className='overflow-y-auto max-h-96 overscroll-none scroll-hidden' ref={tRef}>
       <nav className='h-full font-sans text-black'>
         {toc.map((tocItem) => {
diff --git a/themes/hexo/components/Catalog.js b/themes/hexo/components/Catalog.js
index 9c80cd1a..3252f2ec 100644
--- a/themes/hexo/components/Catalog.js
+++ b/themes/hexo/components/Catalog.js
@@ -2,6 +2,7 @@ import React, { useRef } from 'react'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
 import Progress from './Progress'
+import { useGlobal } from '@/lib/global'
 
 /**
  * 目录导航组件
@@ -10,6 +11,7 @@ import Progress from './Progress'
  * @constructor
  */
 const Catalog = ({ toc }) => {
+  const { locale } = useGlobal()
   // 监听滚动事件
   React.useEffect(() => {
     window.addEventListener('scroll', actionSectionScrollSpy)
@@ -60,7 +62,7 @@ const Catalog = ({ toc }) => {
   }
 
   return <div className='px-3'>
-    <div className='w-full'><i className='mr-1 fas fa-stream' /> 目录</div>
+    <div className='w-full'><i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}</div>
     <div className='w-full py-3'>
       <Progress />
     </div>
diff --git a/themes/matery/components/Catalog.js b/themes/matery/components/Catalog.js
index f58aa9fb..a86326e3 100644
--- a/themes/matery/components/Catalog.js
+++ b/themes/matery/components/Catalog.js
@@ -2,6 +2,7 @@ import React, { useRef } from 'react'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
 import Progress from './Progress'
+import { useGlobal } from '@/lib/global'
 
 /**
  * 目录导航组件
@@ -10,6 +11,7 @@ import Progress from './Progress'
  * @constructor
  */
 const Catalog = ({ toc }) => {
+  const { locale } = useGlobal()
   // 监听滚动事件
   React.useEffect(() => {
     window.addEventListener('scroll', actionSectionScrollSpy)
@@ -59,7 +61,7 @@ const Catalog = ({ toc }) => {
   }
 
   return <div className='px-3 '>
-    <div className='dark:text-white'><i className='mr-1 fas fa-stream' /> 目录</div>
+    <div className='dark:text-white'><i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}</div>
     <div className='w-full py-3'>
       <Progress />
     </div>