diff --git a/pages.json b/pages.json
index c8ce88764eddc496432c85e5fda79e013766b880..e865b7d57bd46097d4cd91cc7db8bcf8198ec816 100644
--- a/pages.json
+++ b/pages.json
@@ -1475,38 +1475,38 @@
   "globalStyle": {
     "pageOrientation": "portrait",
     "navigationBarTitleText": "Hello uniapp x",
-    "navigationBarTextStyle": "white",
-    "navigationBarBackgroundColor": "#007AFF",
-    "backgroundColorContent": "#efeff4",
-    "backgroundColor": "#efeff4"
+    "navigationBarTextStyle": "@navigationBarTextStyle",
+    "navigationBarBackgroundColor": "@navigationBarBackgroundColor",
+    "backgroundColorContent": "@backgroundColorContent",
+    "backgroundColor": "@backgroundColor"
   },
   "tabBar": {
-    "color": "#7A7E83",
-    "selectedColor": "#007AFF",
-    "borderStyle": "black",
-    "backgroundColor": "#F8F8F8",
+    "color": "@tabBarColor",
+    "selectedColor": "@tabBarSelectedColor",
+    "borderStyle": "@tabBarBorderStyle",
+    "backgroundColor": "@tabBarBackgroundColor",
     "list": [{
         "pagePath": "pages/tabBar/component",
-        "iconPath": "static/component.png",
-        "selectedIconPath": "static/componentHL.png",
+        "iconPath": "@tabBarComponentIconPath",
+        "selectedIconPath": "@tabBarComponentSelectedIconPath",
         "text": "内置组件"
       },
       {
         "pagePath": "pages/tabBar/API",
-        "iconPath": "static/api.png",
-        "selectedIconPath": "static/apiHL.png",
+        "iconPath": "@tabBarAPIIconPath",
+        "selectedIconPath": "@tabBarAPISelectedIconPath",
         "text": "接口"
       },
       {
         "pagePath": "pages/tabBar/CSS",
-        "iconPath": "static/css.png",
-        "selectedIconPath": "static/cssHL.png",
+        "iconPath": "@tabBarCSSIconPath",
+        "selectedIconPath": "@tabBarCSSSelectedIconPath",
         "text": "CSS"
       },
       {
         "pagePath": "pages/tabBar/template",
-        "iconPath": "static/template.png",
-        "selectedIconPath": "static/templateHL.png",
+        "iconPath": "@tabBarTemplateIconPath",
+        "selectedIconPath": "@tabBarTemplateSelectedIconPath",
         "text": "模板"
       }
     ]
diff --git a/theme.json b/theme.json
new file mode 100644
index 0000000000000000000000000000000000000000..a5fb2c8e56256af3d3b156933bef188ec7585a76
--- /dev/null
+++ b/theme.json
@@ -0,0 +1,42 @@
+{
+  "light": {
+    "navigationBarTextStyle": "white",
+    "navigationBarBackgroundColor": "#007AFF",
+    "backgroundColorContent": "#efeff4",
+    "backgroundColor": "#efeff4",
+
+    "tabBarColor": "#7A7E83",
+    "tabBarSelectedColor": "#007AFF",
+    "tabBarBorderStyle": "black",
+    "tabBarBackgroundColor": "#F8F8F8",
+
+    "tabBarComponentIconPath": "static/component.png",
+    "tabBarComponentSelectedIconPath": "static/componentHL.png",
+    "tabBarAPIIconPath": "static/api.png",
+    "tabBarAPISelectedIconPath": "static/apiHL.png",
+    "tabBarCSSIconPath": "static/css.png",
+    "tabBarCSSSelectedIconPath": "static/cssHL.png",
+    "tabBarTemplateIconPath": "static/template.png",
+    "tabBarTemplateSelectedIconPath": "static/templateHL.png"
+  },
+  "dark": {
+    "navigationBarTextStyle": "white",
+    "navigationBarBackgroundColor": "#1F1F1F",
+    "backgroundColor": "#1F1F1F",
+    "backgroundColorContent": "#646464",
+
+    "tabBarColor": "#cacaca",
+    "tabBarSelectedColor": "#007AFF",
+    "tabBarBorderStyle": "white",
+    "tabBarBackgroundColor": "#1F1F1F",
+
+    "tabBarComponentIconPath": "static/component.png",
+    "tabBarComponentSelectedIconPath": "static/componentHL.png",
+    "tabBarAPIIconPath": "static/api.png",
+    "tabBarAPISelectedIconPath": "static/apiHL.png",
+    "tabBarCSSIconPath": "static/css.png",
+    "tabBarCSSSelectedIconPath": "static/cssHL.png",
+    "tabBarTemplateIconPath": "static/template.png",
+    "tabBarTemplateSelectedIconPath": "static/templateHL.png"
+  }
+}