diff --git a/en_us/docs/Users/Themes and Styles.md b/en_us/docs/Users/Themes and Styles.md
index f8f3212c..e776a5b7 100644
--- a/en_us/docs/Users/Themes and Styles.md	
+++ b/en_us/docs/Users/Themes and Styles.md	
@@ -17,6 +17,7 @@ Some key files of a theme:
 - `text-editor.theme`: theme file of the text editor (as well as Markdown editor);
 - `web.css`: style sheet file of the read mode of Markdown;
 - `highlight.css`: style sheet file of the read mode of Markdown for code block syntax highlight; VNote uses [Prism](https://prismjs.com/) for syntax highlight in read mode;
+- `icons`: folder for customized icons (**optional**);
 
 ## Samples
 ### Customize Editor Fonts
@@ -154,4 +155,75 @@ Change the font size of the notebook node explorer:
 vnotex--NotebookNodeExplorer QTreeView {
     font-size: 14pt;
 }
-```
\ No newline at end of file
+```
+
+### Customize ICONS
+
+Vnotex Support for adding custom icon folders in themes `icons`, After placing the `SVG` format image of the corresponding name inside, the icon customization in the theme can be realized.
+
+Sample directory: 
+
+```
+.
+├── cover.png
+├── highlight.css
+├── icons
+│   ├── ***.svg
+│   ├── ***.svg
+│   └── ***.svg
+├── interface.qss
+├── palette.json
+├── text-editor.theme
+└── web.css
+```
+
+Mapping between common ICONS: 
+
+**Notes**
+
+![](vx_images/567140813269078.png)
+
+| Name            | Explain         |
+| :-------------- | :-------------- |
+| folder_node.svg | Folder of nodes |
+| file_node.svg   | Nodes           |
+
+**Top Menu bar**
+
+From left to right.
+
+![](vx_images/52411495826601.png)
+
+| Name                  | Explain             |
+| :-------------------- | :------------------ |
+| notebook_menu.svg     | Notebook            |
+| new_note.svg          | New Note            |
+| import_menu.svg       | Import              |
+| export_menu.svg       | Export              |
+| flash_page_menu.svg   | Flash Page          |
+| quick_access_menu.svg | Quick Access        |
+| task_menu.svg         | Task                |
+| united_entry.svg      | United Entry        |
+| expand.svg            | Expand Content Area |
+| settings_menu.svg     | Settings            |
+| menu.svg              | Menu                |
+
+**Left navigation bar**
+
+From top to down.
+
+![](vx_images/55762704615693.png)
+
+| Name                | Explain    |
+| :------------------ | :--------- |
+| navigation_dock.svg | Navigation |
+| history_dock.svg    | History    |
+| tag_dock.svg        | Tags       |
+| search_dock.svg     | Search     |
+| snippet_dock.svg    | Snippets   |
+
+
+Demo: 
+
+![](vx_images/508490695826601.png)
+
diff --git a/en_us/docs/Users/vx.json b/en_us/docs/Users/vx.json
index 5aebf38f..52db5d06 100644
--- a/en_us/docs/Users/vx.json
+++ b/en_us/docs/Users/vx.json
@@ -95,7 +95,7 @@
             "attachment_folder": "",
             "created_time": "2018-11-24T12:18:17Z",
             "id": "12",
-            "modified_time": "2021-12-23T05:58:40Z",
+            "modified_time": "2022-08-09T02:46:01Z",
             "name": "Themes and Styles.md",
             "signature": "2110466178163",
             "tags": [
diff --git a/en_us/docs/Users/vx_images/508490695826601.png b/en_us/docs/Users/vx_images/508490695826601.png
new file mode 100644
index 00000000..b32e1f4e
Binary files /dev/null and b/en_us/docs/Users/vx_images/508490695826601.png differ
diff --git a/en_us/docs/Users/vx_images/52411495826601.png b/en_us/docs/Users/vx_images/52411495826601.png
new file mode 100644
index 00000000..129b4b27
Binary files /dev/null and b/en_us/docs/Users/vx_images/52411495826601.png differ
diff --git a/en_us/docs/Users/vx_images/55762704615693.png b/en_us/docs/Users/vx_images/55762704615693.png
new file mode 100644
index 00000000..888bd1f3
Binary files /dev/null and b/en_us/docs/Users/vx_images/55762704615693.png differ
diff --git a/en_us/docs/Users/vx_images/567140813269078.png b/en_us/docs/Users/vx_images/567140813269078.png
new file mode 100644
index 00000000..d0f751ce
Binary files /dev/null and b/en_us/docs/Users/vx_images/567140813269078.png differ
diff --git a/vx_notebook/notebook.db b/vx_notebook/notebook.db
index 6711641b..e0608507 100644
Binary files a/vx_notebook/notebook.db and b/vx_notebook/notebook.db differ
diff --git a/zh_cn/docs/用户/vx.json b/zh_cn/docs/用户/vx.json
index 35e01712..54005a42 100644
--- a/zh_cn/docs/用户/vx.json
+++ b/zh_cn/docs/用户/vx.json
@@ -95,7 +95,7 @@
             "attachment_folder": "",
             "created_time": "2018-11-24T12:30:05Z",
             "id": "39",
-            "modified_time": "2021-12-23T06:01:10Z",
+            "modified_time": "2022-08-07T05:14:57Z",
             "name": "主题和样式.md",
             "signature": "102269103520883",
             "tags": [
diff --git a/zh_cn/docs/用户/vx_images/292792926941444.png b/zh_cn/docs/用户/vx_images/292792926941444.png
new file mode 100644
index 00000000..b0dcad95
Binary files /dev/null and b/zh_cn/docs/用户/vx_images/292792926941444.png differ
diff --git a/zh_cn/docs/用户/vx_images/345532103615693.png b/zh_cn/docs/用户/vx_images/345532103615693.png
new file mode 100644
index 00000000..c70473c3
Binary files /dev/null and b/zh_cn/docs/用户/vx_images/345532103615693.png differ
diff --git a/zh_cn/docs/用户/vx_images/396011412269078.png b/zh_cn/docs/用户/vx_images/396011412269078.png
new file mode 100644
index 00000000..3769400b
Binary files /dev/null and b/zh_cn/docs/用户/vx_images/396011412269078.png differ
diff --git a/zh_cn/docs/用户/vx_images/61273190889848.png b/zh_cn/docs/用户/vx_images/61273190889848.png
new file mode 100644
index 00000000..e8bda67c
Binary files /dev/null and b/zh_cn/docs/用户/vx_images/61273190889848.png differ
diff --git a/zh_cn/docs/用户/主题和样式.md b/zh_cn/docs/用户/主题和样式.md
index 1f189921..2d25de64 100644
--- a/zh_cn/docs/用户/主题和样式.md
+++ b/zh_cn/docs/用户/主题和样式.md
@@ -17,6 +17,7 @@
 - `text-editor.theme`: 文本编辑器（以及Markdown编辑器）的主题文件；
 - `web.css`: Markdown阅读模式的样式文件；
 - `highlight.css`: Markdown阅读模式的代码块语法高亮样式文件；VNote在阅读模式使用[Prism](https://prismjs.com/)来进行语法高亮;
+- `icons`: 自定义图标文件夹 **可选** ；
 
 ## 示例
 ### 自定义编辑器字体
@@ -154,4 +155,75 @@ QTreeView, QListView {
 vnotex--NotebookNodeExplorer QTreeView {
     font-size: 14pt;
 }
-```
\ No newline at end of file
+```
+
+### 自定义图标
+
+Vnotex 支持在主题中添加自定义图标文件夹 `icons`，往里面放置对应名称的 `svg` 格式图片后，即可实现主题中的图标定制化。
+
+目录样例结构如下：
+
+```
+.
+├── cover.png
+├── highlight.css
+├── icons
+│   ├── ***.svg
+│   ├── ***.svg
+│   └── ***.svg
+├── interface.qss
+├── palette.json
+├── text-editor.theme
+└── web.css
+```
+
+常用图标的名称对应关系：
+
+**笔记**
+
+![](vx_images/61273190889848.png)
+
+| 名称             | 解释   |
+| :-------------- | :----- |
+| folder_node.svg | 文件夹 |
+| file_node.svg   | 笔记   |
+
+**顶部菜单**
+
+从左到右
+
+![](vx_images/345532103615693.png)
+
+| 名称                   | 解释       |
+| :-------------------- | :-------- |
+| notebook_menu.svg     | 笔记本     |
+| new_note.svg          | 新建笔记   |
+| import_menu.svg       | 导入       |
+| export_menu.svg       | 导出       |
+| flash_page_menu.svg   | 灵犀页     |
+| quick_access_menu.svg | 快速访问   |
+| task_menu.svg         | 任务       |
+| united_entry.svg      | 统一入口   |
+| expand.svg            | 扩展内容区 |
+| settings_menu.svg     | 设置       |
+| menu.svg              | 菜单       |
+
+**左侧导航栏**
+
+从上到下
+
+![](vx_images/292792926941444.png)
+
+| 名称                 | 解释 |
+| :------------------ | :--- |
+| navigation_dock.svg | 导航 |
+| history_dock.svg    | 历史 |
+| tag_dock.svg        | 标签 |
+| search_dock.svg     | 搜索 |
+| snippet_dock.svg    | 片段 |
+
+
+效果如下
+
+![](vx_images/396011412269078.png)
+