diff --git a/src/public/app/widgets/type_widgets/options/appearance/fonts.js b/src/public/app/widgets/type_widgets/options/appearance/fonts.js
index 059c98740..3204f045d 100644
--- a/src/public/app/widgets/type_widgets/options/appearance/fonts.js
+++ b/src/public/app/widgets/type_widgets/options/appearance/fonts.js
@@ -1,8 +1,9 @@
 import OptionsWidget from "../options_widget.js";
 import utils from "../../../../services/utils.js";
+import { t } from "../../../../services/i18n.js";
 
 const FONT_FAMILIES = [
-    { value: "theme", label: "Theme defined" },
+    { value: "theme", label: t("fonts.theme_defined") },
     { value: "serif", label: "Serif" },
     { value: "sans-serif", label: "Sans Serif" },
     { value: "monospace", label: "Monospace" },
@@ -29,18 +30,18 @@ const FONT_FAMILIES = [
 
 const TPL = `
 <div class="options-section">
-    <h4>Fonts</h4>
+    <h4>${t("fonts.fonts")}</h4>
     
-    <h5>Main Font</h5>
+    <h5>${t("fonts.main_font")}</h5>
     
     <div class="form-group row">
         <div class="col-6">
-            <label>Font family</label>
+            <label>${t("fonts.font_family")}</label>
             <select class="main-font-family form-control"></select>
         </div>
     
         <div class="col-6">
-            <label>Size</label>
+            <label>${t("fonts.size")}</label>
 
             <div class="input-group">
                 <input type="number" class="main-font-size form-control options-number-input" min="50" max="200" step="10"/>
@@ -51,16 +52,16 @@ const TPL = `
         </div>
     </div>
 
-    <h5>Note Tree Font</h5>
+    <h5>${t("fonts.note_tree_font")}</h5>
 
     <div class="form-group row">
         <div class="col-4">
-            <label>Font family</label>
+            <label>${t("fonts.font_family")}</label>
             <select class="tree-font-family form-control"></select>
         </div>
     
         <div class="col-4">
-            <label>Size</label>
+            <label>${t("fonts.size")}</label>
 
             <div class="input-group">
                 <input type="number" class="tree-font-size form-control options-number-input" min="50" max="200" step="10"/>
@@ -71,16 +72,16 @@ const TPL = `
         </div>
     </div>
     
-    <h5>Note Detail Font</h5>
+    <h5>${t("fonts.note_detail_font")}</h5>
     
     <div class="form-group row">
         <div class="col-4">
-            <label>Font family</label>
+            <label>${t("fonts.font_family")}</label>
             <select class="detail-font-family form-control"></select>
         </div>
         
         <div class="col-4">
-            <label>Size</label>
+            <label>${t("fonts.size")}</label>
 
             <div class="input-group">
                 <input type="number" class="detail-font-size form-control options-number-input" min="50" max="200" step="10"/>
@@ -91,16 +92,16 @@ const TPL = `
         </div>
     </div>
     
-    <h5>Monospace (code) Font</h5>
+    <h5>${t("fonts.monospace_font")}</h5>
     
     <div class="form-group row">
         <div class="col-4">
-            <label>Font family</label>
+            <label>${t("fonts.font_family")}</label>
             <select class="monospace-font-family form-control"></select>
         </div>
     
         <div class="col-4">
-            <label>Size</label>
+            <label>${t("fonts.size")}</label>
 
             <div class="input-group">
                 <input type="number" class="monospace-font-size form-control options-number-input" min="50" max="200" step="10"/>
@@ -111,13 +112,13 @@ const TPL = `
         </div>
     </div>
 
-    <p>Note that tree and detail font sizing is relative to the main font size setting.</p>
+    <p>${t("fonts.note_tree_and_detail_font_sizing")}</p>
 
-    <p>Not all listed fonts may be available on your system.</p>
+    <p>${t("fonts.not_all_fonts_available")}</p>
     
     <p>
-        To apply font changes, click on 
-        <button class="btn btn-micro reload-frontend-button">reload frontend</button>
+        ${t("fonts.apply_font_changes")}
+        <button class="btn btn-micro reload-frontend-button">${t("fonts.reload_frontend")}</button>
     </p>
 </div>`;
 
diff --git a/src/public/translations/cn/translation.json b/src/public/translations/cn/translation.json
index f7d903689..78a0c29d8 100644
--- a/src/public/translations/cn/translation.json
+++ b/src/public/translations/cn/translation.json
@@ -975,5 +975,19 @@
         "button_text": "清理数据库",
         "vacuuming_database": "正在清理数据库...",
         "database_vacuumed": "数据库已清理"
+    },
+    "fonts": {
+        "theme_defined": "跟随主题",
+        "fonts": "字体",
+        "main_font": "主字体",
+        "font_family": "字体系列",
+        "size": "大小",
+        "note_tree_font": "笔记树字体",
+        "note_detail_font": "笔记详情字体",
+        "monospace_font": "等宽（代码）字体",
+        "note_tree_and_detail_font_sizing": "请注意，树状字体和详细字体的大小相对于主字体大小设置。",
+        "not_all_fonts_available": "并非所有列出的字体都可能在您的系统上可用。",
+        "apply_font_changes": "要应用字体更改，请点击",
+        "reload_frontend": "重新加载前端"
     }
 }
diff --git a/src/public/translations/en/translation.json b/src/public/translations/en/translation.json
index 215498707..b929ff27b 100644
--- a/src/public/translations/en/translation.json
+++ b/src/public/translations/en/translation.json
@@ -976,5 +976,19 @@
         "button_text": "Vacuum database",
         "vacuuming_database": "Vacuuming database...",
         "database_vacuumed": "Database has been vacuumed"
+    },
+    "fonts": {
+        "theme_defined": "Theme defined",
+        "fonts": "Fonts",
+        "main_font": "Main Font",
+        "font_family": "Font family",
+        "size": "Size",
+        "note_tree_font": "Note Tree Font",
+        "note_detail_font": "Note Detail Font",
+        "monospace_font": "Monospace (code) Font",
+        "note_tree_and_detail_font_sizing": "Note that tree and detail font sizing is relative to the main font size setting.",
+        "not_all_fonts_available": "Not all listed fonts may be available on your system.",
+        "apply_font_changes": "To apply font changes, click on",
+        "reload_frontend": "reload frontend"
     }
 }