diff --git a/src/assets/images/exception/texture.png b/src/assets/images/exception/texture.png
new file mode 100644
index 00000000..39a084a4
Binary files /dev/null and b/src/assets/images/exception/texture.png differ
diff --git a/src/assets/images/exception/theme-color.png b/src/assets/images/exception/theme-color.png
new file mode 100644
index 00000000..9d7dd3fd
Binary files /dev/null and b/src/assets/images/exception/theme-color.png differ
diff --git a/src/components/ThemeColorSelect/index.ts b/src/components/ThemeColorSelect/index.ts
new file mode 100644
index 00000000..6cdfbddb
--- /dev/null
+++ b/src/components/ThemeColorSelect/index.ts
@@ -0,0 +1,3 @@
+import ThemeColorSelect from './index.vue';
+
+export { ThemeColorSelect };
diff --git a/src/components/ThemeColorSelect/index.vue b/src/components/ThemeColorSelect/index.vue
new file mode 100644
index 00000000..035d9507
--- /dev/null
+++ b/src/components/ThemeColorSelect/index.vue
@@ -0,0 +1,215 @@
+
+
+
+
+
+
+
+
+
+ 主题颜色选择
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.name }}
+
+
+ {{ item.pinyin.toUpperCase() }}
+
+
+
+ {{ item.hex }}
+
+ {{
+ `rgb(${item.RGB[0]}, ${item.RGB[0]}, ${item.RGB[0]})`
+ }}
+
+
+
+
+
+
+
+
+
+
+ {{ appThemeDetail.name }}
+
+
+ 中国色
+
+
+ {{ appThemeDetail.pinyin.toUpperCase() }}
+
+
+
+
![]()
+
+
+
+
+
+
+
+
+
+
diff --git a/src/layout/components/Header/index.vue b/src/layout/components/Header/index.vue
index 8d742f59..a26e01c6 100644
--- a/src/layout/components/Header/index.vue
+++ b/src/layout/components/Header/index.vue
@@ -14,6 +14,7 @@
+
@@ -24,6 +25,7 @@