diff --git a/src/images/book/chuangye.jpg b/src/images/book/chuangye.jpg
new file mode 100644
index 0000000..e416f4f
Binary files /dev/null and b/src/images/book/chuangye.jpg differ
diff --git a/src/images/book/dangan.jpg b/src/images/book/dangan.jpg
new file mode 100644
index 0000000..c096913
Binary files /dev/null and b/src/images/book/dangan.jpg differ
diff --git a/src/images/book/fuye.jpg b/src/images/book/fuye.jpg
new file mode 100644
index 0000000..0edb989
Binary files /dev/null and b/src/images/book/fuye.jpg differ
diff --git a/src/images/book/hours.jpg b/src/images/book/hours.jpg
new file mode 100644
index 0000000..6b5ef6e
Binary files /dev/null and b/src/images/book/hours.jpg differ
diff --git a/src/images/book/poquan.jpg b/src/images/book/poquan.jpg
new file mode 100644
index 0000000..038ed14
Binary files /dev/null and b/src/images/book/poquan.jpg differ
diff --git a/src/images/book/rework.jpg b/src/images/book/rework.jpg
new file mode 100644
index 0000000..0f85f40
Binary files /dev/null and b/src/images/book/rework.jpg differ
diff --git a/src/pages/index/componments/Nomadbook/index.jsx b/src/pages/index/componments/Nomadbook/index.jsx
new file mode 100644
index 0000000..9fd79f4
--- /dev/null
+++ b/src/pages/index/componments/Nomadbook/index.jsx
@@ -0,0 +1,59 @@
+import { View, Text, Image, Button, Icon } from "@tarojs/components";
+import { useLoad } from "@tarojs/taro";
+import Taro from "@tarojs/taro";
+import {
+  AtAvatar,
+  AtTag,
+  AtIcon,
+  AtTabBar,
+  AtButton,
+  AtAccordion,
+  AtList,
+  AtListItem,
+} from "taro-ui";
+import "./index.scss";
+import rework from "@/images/book/rework.jpg";
+import dangan from "@/images/book/dangan.jpg";
+import fuye from "@/images/book/fuye.jpg";
+import poquan from "@/images/book/poquan.jpg";
+import chuangye from "@/images/book/chuangye.jpg";
+import hours from "@/images/book/hours.jpg";
+
+import { useEffect, useState } from "react";
+
+const Nomadbook = () => {
+  const [open, setopen] = useState(false);
+
+  return (
+    <View className="Nomadbook">
+      <View className="book">
+        {[
+          { imagePath: rework },
+          { imagePath: dangan },
+          { imagePath: fuye },
+          { imagePath: poquan },
+          { imagePath: chuangye },
+          { imagePath: hours },
+        ].map((item, index) => {
+          return (
+            <View className="bookItem">
+              {" "}
+              <Image
+                style={{
+                  width: "100%",
+                  height: "100%",
+                  background: " #fff",
+                  borderRadius: "10px",
+                }}
+                mode="scaleToFill"
+                src={item.imagePath}
+              />
+            </View>
+          );
+        })}
+      </View>
+    </View>
+  );
+};
+
+export default Nomadbook;
diff --git a/src/pages/index/componments/Nomadbook/index.scss b/src/pages/index/componments/Nomadbook/index.scss
new file mode 100644
index 0000000..fec35a4
--- /dev/null
+++ b/src/pages/index/componments/Nomadbook/index.scss
@@ -0,0 +1,33 @@
+.Nomadbook {
+  padding: 10px;
+  font-size: 25px;
+  width: 320px;
+  height: 230px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  // justify-content: center;
+  // background-color: red;
+  border-radius: 20px;
+  border: solid 1px #8c8c8c;
+
+  .book{
+    // width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    // background-color: aquamarine;
+    padding: 10px;
+    .bookItem {
+      width: 80px;
+      height: 80px;
+      // background-color: yellow;
+      margin-top: 10px;
+      // margin-right: 10px;
+    }
+  }
+  
+}
diff --git a/src/pages/index/index.jsx b/src/pages/index/index.jsx
index 1007a06..4582c24 100644
--- a/src/pages/index/index.jsx
+++ b/src/pages/index/index.jsx
@@ -25,6 +25,8 @@ import a6 from "@/images/meetup/a6.jpg";
 
 import TabbarCom from "@/componments/TabbarCom";
 import QrCode from "@/componments/QrCode";
+import Nomadbook from "@/pages/index/componments/Nomadbook";
+
 
 import { useEffect, useState } from "react";
 // import beijing from "../../images/city/beijing.jpg";
@@ -119,6 +121,11 @@ export default function Index() {
     );
   };
 
+  // 图书
+  // const Nomadbook = () => {
+  //   return <View className="Nomadbook" onClick={() => {}}>Nomadbook</View>;
+  // };
+
   const HomeCardItem = () => {
     return [
       {
@@ -128,11 +135,12 @@ export default function Index() {
         customCom: "test",
       },
       // 双数插入
+   
       {
-        cityName: "加入微信群",
+        cityName: "nomad书籍",
         imagePath: shanghai,
         isCustom: true,
-        customCom: <JoinWechat />,
+        customCom: <Nomadbook/>,
       },
       {
         cityName: "上海",
@@ -140,12 +148,12 @@ export default function Index() {
         isCustom: false,
         customCom: "test",
       },
-      // {
-      //   cityName: "同城活动",
-      //   imagePath: shanghai,
-      //   isCustom: true,
-      //   customCom: <JoinWechat />,
-      // },
+      {
+        cityName: "加入微信群",
+        imagePath: shanghai,
+        isCustom: true,
+        customCom: <JoinWechat />,
+      },
       {
         cityName: "广州",
         imagePath: guangzhou,
diff --git a/src/pages/index/index.scss b/src/pages/index/index.scss
index ccbf900..869aa1e 100644
--- a/src/pages/index/index.scss
+++ b/src/pages/index/index.scss
@@ -35,9 +35,9 @@
         flex-direction: column;
         align-items: center;
         // justify-content: center;
-        // background-color: red;
+        // background-color: #ffe7ba;
         border-radius: 20px;
-        border: solid 1px;
+        border: solid 1px #8c8c8c;
         .CustomHeader {
           width: 100%;
           height: 60px;
@@ -64,6 +64,21 @@
         }
       }
 
+      .Nomadbook {
+        padding: 10px;
+        font-size: 25px;
+        width: 320px;
+        height: 230px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        // justify-content: center;
+        // background-color: red;
+        border-radius: 20px;
+        border: solid 1px #8c8c8c;
+
+      }
+
       .homeCardItem {
         margin-top: 10px;
         width: 340px;