diff --git a/doc/md/all_components.md b/doc/md/all_components.md
new file mode 100644
index 00000000..bd4f3311
--- /dev/null
+++ b/doc/md/all_components.md
@@ -0,0 +1,38 @@
+# 支持的组件
+
+|目录|说明|备注|
+|----|----|----|
+|FluApp|初始化入口|支持路由跳转|
+|FluWindow|无边框窗口|解决windows拖动闪烁问题|
+|FluAppBar|窗口顶部标题栏|支持拖动窗口，最小化、最大化、关闭窗口|
+|FluText|Text文本||
+|FluButton|按钮||
+|FluFilledButton|实心按钮||
+|FluIconButton|图标按钮||
+|FluTextButton|文本按钮||
+|FluIcon|图标||
+|FluRadioButton|单选按钮||
+|FluTextBox|单行输入框||
+|FluMultiLineTextBox|多行输入框||
+|FluToggleSwitch|开关按钮||
+|FluSlider|拖动条||
+|FluInfoBar|提示Toast||
+|FluContentDialog|对话框||
+|FluProgressBar|条形进度条||
+|FluProgressRing|圆形进度条||
+|FluRectangle|矩形|支持部分圆角、clip|
+|FluMenu|菜单框||
+|FluTooltip|tooltip提示框||
+|FluTreeView|树控件||
+|FluTheme|主题设置|支持主题颜色切换，夜间模式|
+|FluCarousel|轮播图组件|支持无限轮播|
+|FluTimePicker|时间选择器||
+|FluDatePicker|日期选择器||
+|FluMenu|菜单Popup||
+|FluNavigationView|响应式导航布局||
+|FluScrollbar|滚动条||
+|FluToggleButton|开关按钮||
+|FluPagination|分页组件||
+|FluTableView|表格组件||
+|FluMediaPlayer|播放器||
+|FluFlipView|FlipView||
\ No newline at end of file
diff --git a/doc/preview/demo_filledbtn.png b/doc/preview/demo_filledbtn.png
new file mode 100755
index 00000000..f8893aa2
Binary files /dev/null and b/doc/preview/demo_filledbtn.png differ
diff --git a/doc/preview/demo_icon.png b/doc/preview/demo_icon.png
new file mode 100755
index 00000000..8001423a
Binary files /dev/null and b/doc/preview/demo_icon.png differ
diff --git a/doc/preview/demo_large.png b/doc/preview/demo_large.png
new file mode 100755
index 00000000..371b7a47
Binary files /dev/null and b/doc/preview/demo_large.png differ
diff --git a/doc/preview/demo_multiline_textbox.png b/doc/preview/demo_multiline_textbox.png
new file mode 100755
index 00000000..367db31b
Binary files /dev/null and b/doc/preview/demo_multiline_textbox.png differ
diff --git a/doc/preview/demo_radiobtn.png b/doc/preview/demo_radiobtn.png
new file mode 100755
index 00000000..0c274526
Binary files /dev/null and b/doc/preview/demo_radiobtn.png differ
diff --git a/doc/preview/demo_standardbtn.png b/doc/preview/demo_standardbtn.png
new file mode 100755
index 00000000..792eeeea
Binary files /dev/null and b/doc/preview/demo_standardbtn.png differ
diff --git a/doc/preview/demo_textbox.png b/doc/preview/demo_textbox.png
new file mode 100755
index 00000000..110c180c
Binary files /dev/null and b/doc/preview/demo_textbox.png differ
diff --git a/doc/preview/demo_textbtn.png b/doc/preview/demo_textbtn.png
new file mode 100755
index 00000000..8a16905e
Binary files /dev/null and b/doc/preview/demo_textbtn.png differ
diff --git a/doc/preview/demo_toggle_btn.png b/doc/preview/demo_toggle_btn.png
new file mode 100644
index 00000000..0224d65f
Binary files /dev/null and b/doc/preview/demo_toggle_btn.png differ
diff --git a/doc/preview/demo_toggle_switch.png b/doc/preview/demo_toggle_switch.png
new file mode 100755
index 00000000..03086fc3
Binary files /dev/null and b/doc/preview/demo_toggle_switch.png differ
diff --git a/doc/preview/fluent_design.svg b/doc/preview/fluent_design.svg
new file mode 100644
index 00000000..4bedcc29
--- /dev/null
+++ b/doc/preview/fluent_design.svg
@@ -0,0 +1,7 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 73 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000" stroke="#000000">
+
<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+
<g id="SVGRepo_iconCarrier"> <title>design-and-ux/fluent-design</title> <desc>Created with Sketch.</desc> <defs> </defs> <g id="design-and-ux/fluent-design" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="container" transform="translate(2.000000, 2.000000)" fill="#FFFFFF" fill-rule="nonzero" stroke="#0078D7" stroke-width="2"> <rect id="mask" x="-1" y="-1" width="71" height="71" rx="14"> </rect> </g> <g id="fluent" transform="translate(22.000000, 11.000000)" fill="#0078D7" fill-rule="nonzero"> <polygon id="fluent_01" points="14.7809081 0 0 8.45050462 0 42.2525249 14.7809081 50.7030295 14.7809081 33.8020194 29.561837 25.3515148 14.7809081 16.9010101 29.561837 8.45050462"> </polygon> </g> </g> </g>
+
</svg>
\ No newline at end of file
diff --git a/doc/preview/qt_creator_project.png b/doc/preview/qt_creator_project.png
new file mode 100755
index 00000000..6a9f900a
Binary files /dev/null and b/doc/preview/qt_creator_project.png differ