diff --git a/src/assets/svg/tab/chip-icon-active.svg b/src/assets/svg/tab/chip-icon-active.svg
new file mode 100644
index 0000000..d997b47
--- /dev/null
+++ b/src/assets/svg/tab/chip-icon-active.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EC2E5B;}
+	.st1{fill:#DC5C7F;}
+	.st2{fill:#0F6569;}
+</style>
+<g>
+	<path class="st0" d="M46.09,17.49L24.1,1.57c-0.08-0.06-0.19-0.06-0.27,0L2.31,17.21c-0.36,0.26-0.36,0.81,0,1.07L23.2,33.41
+		c0.49,0.35,1.15,0.35,1.64,0l21.25-15.45C46.25,17.84,46.25,17.6,46.09,17.49z M24.96,7.12c0-0.24,0.28-0.37,0.47-0.22l7.68,6.15
+		c0.21,0.17,0.09,0.51-0.18,0.51H29.4c-0.07,0-0.13-0.02-0.18-0.06l-4.15-3.33c-0.07-0.05-0.11-0.14-0.11-0.22V7.12z M14.88,13.08
+		l7.68-6.15c0.19-0.15,0.47-0.02,0.47,0.22v2.82c0,0.09-0.04,0.17-0.11,0.22l-4.15,3.33c-0.05,0.04-0.11,0.06-0.18,0.06h-3.53
+		C14.79,13.59,14.67,13.24,14.88,13.08z M23.02,26.86c0,0.25-0.29,0.38-0.48,0.21L9.58,15.5C9.38,15.32,9.51,15,9.77,15h6.37
+		c0.07,0,0.13,0.02,0.18,0.06l6.59,5.3c0.07,0.05,0.11,0.14,0.11,0.22V26.86z M24.22,17.79c-0.11,0.11-0.29,0.11-0.41,0l-3.55-3.55
+		c-0.13-0.13-0.11-0.34,0.04-0.44l3.55-2.46c0.1-0.07,0.23-0.07,0.33,0l3.51,2.44c0.15,0.1,0.17,0.31,0.04,0.44L24.22,17.79z
+		 M38.4,15.47L25.44,27.05c-0.18,0.16-0.48,0.03-0.48-0.21v-6.28c0-0.09,0.04-0.17,0.11-0.22l6.59-5.3
+		c0.05-0.04,0.11-0.06,0.18-0.06h6.37C38.48,14.97,38.6,15.3,38.4,15.47z"/>
+	<path class="st0" d="M45.27,21.49L24.9,35.38c-0.55,0.38-1.28,0.38-1.83,0L2.71,21.49c-0.31-0.21-0.72,0.01-0.72,0.38v2.9
+		c0,0.15,0.07,0.29,0.19,0.37l20.73,15.08c0.64,0.46,1.51,0.45,2.13-0.03l20.77-16.05c0.11-0.09,0.18-0.22,0.18-0.36v-1.9
+		C45.99,21.5,45.58,21.28,45.27,21.49z"/>
+	<path class="st0" d="M45.02,27.7L24.91,42.33c-0.55,0.4-1.29,0.4-1.83,0L2.96,27.7c-0.4-0.29-0.97-0.01-0.97,0.49v1.49
+		c0,0.2,0.09,0.38,0.25,0.49L23.02,45.3c0.58,0.42,1.36,0.42,1.94,0l20.78-15.11c0.16-0.11,0.25-0.3,0.25-0.49V28.2
+		C45.99,27.7,45.43,27.41,45.02,27.7z"/>
+</g>
+</svg>
diff --git a/src/assets/svg/tab/chip.svg b/src/assets/svg/tab/chip-icon-hover.svg
similarity index 100%
rename from src/assets/svg/tab/chip.svg
rename to src/assets/svg/tab/chip-icon-hover.svg
diff --git a/src/assets/svg/tab/chip-icon.svg b/src/assets/svg/tab/chip-icon.svg
new file mode 100644
index 0000000..1a22648
--- /dev/null
+++ b/src/assets/svg/tab/chip-icon.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EC2E5B;}
+	.st1{fill:#DC5C7F;}
+	.st2{fill:#0F6569;}
+</style>
+<g>
+	<path class="st2" d="M46.03,17.62L24.04,1.7c-0.08-0.06-0.19-0.06-0.27,0L2.26,17.34c-0.36,0.26-0.36,0.81,0,1.07l20.89,15.12
+		c0.49,0.35,1.15,0.35,1.64,0l21.25-15.45C46.19,17.97,46.19,17.73,46.03,17.62z M24.91,7.25c0-0.24,0.28-0.37,0.47-0.22l7.68,6.15
+		c0.21,0.17,0.09,0.51-0.18,0.51h-3.53c-0.07,0-0.13-0.02-0.18-0.06l-4.15-3.33c-0.07-0.05-0.11-0.14-0.11-0.22V7.25z M14.82,13.2
+		l7.68-6.15c0.19-0.15,0.47-0.02,0.47,0.22v2.82c0,0.09-0.04,0.17-0.11,0.22l-4.15,3.33c-0.05,0.04-0.11,0.06-0.18,0.06H15
+		C14.73,13.71,14.61,13.37,14.82,13.2z M22.96,26.99c0,0.25-0.29,0.38-0.48,0.21L9.52,15.63c-0.2-0.18-0.07-0.5,0.19-0.5h6.37
+		c0.07,0,0.13,0.02,0.18,0.06l6.59,5.3c0.07,0.05,0.11,0.14,0.11,0.22V26.99z M24.17,17.92c-0.11,0.11-0.29,0.11-0.41,0l-3.55-3.55
+		c-0.13-0.13-0.11-0.34,0.04-0.44l3.55-2.46c0.1-0.07,0.23-0.07,0.33,0l3.51,2.44c0.15,0.1,0.17,0.31,0.04,0.44L24.17,17.92z
+		 M38.35,15.6L25.38,27.17c-0.18,0.16-0.48,0.03-0.48-0.21v-6.28c0-0.09,0.04-0.17,0.11-0.22l6.59-5.3
+		c0.05-0.04,0.11-0.06,0.18-0.06h6.37C38.42,15.1,38.54,15.42,38.35,15.6z"/>
+	<path class="st2" d="M45.22,21.62L24.85,35.5c-0.55,0.38-1.28,0.38-1.83,0L2.65,21.62C2.35,21.41,1.94,21.63,1.94,22v2.9
+		c0,0.15,0.07,0.29,0.19,0.37l20.73,15.08c0.64,0.46,1.51,0.45,2.13-0.03l20.77-16.05c0.11-0.09,0.18-0.22,0.18-0.36V22
+		C45.94,21.63,45.52,21.41,45.22,21.62z"/>
+	<path class="st2" d="M44.97,27.83L24.85,42.46c-0.55,0.4-1.29,0.4-1.83,0L2.9,27.83c-0.4-0.29-0.97-0.01-0.97,0.49v1.49
+		c0,0.2,0.09,0.38,0.25,0.49l20.78,15.11c0.58,0.42,1.36,0.42,1.94,0l20.78-15.11c0.16-0.11,0.25-0.3,0.25-0.49v-1.49
+		C45.94,27.83,45.37,27.54,44.97,27.83z"/>
+</g>
+</svg>
diff --git a/src/assets/svg/tab/hero-icon-active.svg b/src/assets/svg/tab/hero-icon-active.svg
new file mode 100644
index 0000000..31ac793
--- /dev/null
+++ b/src/assets/svg/tab/hero-icon-active.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EC2E5B;}
+	.st1{fill:#DC5C7F;}
+	.st2{fill:#0F6569;}
+</style>
+<g>
+	<path class="st0" d="M41,19c-0.25-0.25-1-1-1-1c0-7-4-16-14.41-16.47C18.19,1.19,12,2,7,12s2,17,2,17c0-7,3-9,3-9
+		c1.19,1.03,0.92,0.95,4,3c3,2,4,5,4,5s0-1.67,0-3c0-0.67-1-3-1-3s1,1,2,3c2.08,4.15,1.28,9.52,1.05,10C27.03,34.93,31,25,31,25
+		c1,5-1.78,7-1.78,7L29,35l4.89-1.33C38.78,31.34,40,20,40,20c1,1,3,0,3,0S42,20,41,19z"/>
+	<path class="st0" d="M22.05,35c-0.02,0-0.03,0-0.05,0C22.01,35.06,22.03,35.04,22.05,35z"/>
+	<path class="st0" d="M28,33l-1,1c0,0-0.16,1.53,0,2c0.53,1.59,3,6,3,6l-4,4h-5v-2c0,0,1.74-2.14,2-3c0.07-0.24,0.09-0.77,0-1
+		c-0.24-0.66-1.31-1.86-2-2c-0.78-0.16-3,1-3,1l-4-1l-4-6v-1.04L13,28l-1-5l-1-1v6l-3,3l1,2l4,6l5,1c0,0,2.22-1.16,3-1
+		c0.35,0.07,0.89,0.66,1,1c0.08,0.24,0.07,0.76,0,1c-0.26,0.86-2,3-2,3v3h6l5-5c0,0-2.47-4.41-3-6C27.76,35.29,28,33,28,33z"/>
+</g>
+</svg>
diff --git a/src/assets/svg/tab/hero.svg b/src/assets/svg/tab/hero-icon-hover.svg
similarity index 100%
rename from src/assets/svg/tab/hero.svg
rename to src/assets/svg/tab/hero-icon-hover.svg
diff --git a/src/assets/svg/tab/hero-icon.svg b/src/assets/svg/tab/hero-icon.svg
new file mode 100644
index 0000000..b87113b
--- /dev/null
+++ b/src/assets/svg/tab/hero-icon.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EC2E5B;}
+	.st1{fill:#DC5C7F;}
+	.st2{fill:#0F6569;}
+</style>
+<g>
+	<path class="st2" d="M40.94,19.13c-0.25-0.25-1-1-1-1c0-7-4-16-14.41-16.47c-7.4-0.34-13.59,0.47-18.59,10.47s2,17,2,17
+		c0-7,3-9,3-9c1.19,1.03,0.92,0.95,4,3c3,2,4,5,4,5s0-1.67,0-3c0-0.67-1-3-1-3s1,1,2,3c2.08,4.15,1.28,9.52,1.05,10
+		c4.98-0.07,8.95-10,8.95-10c1,5-1.78,7-1.78,7l-0.22,3l4.89-1.33c4.89-2.33,6.11-13.67,6.11-13.67c1,1,3,0,3,0
+		S41.94,20.13,40.94,19.13z"/>
+	<path class="st2" d="M21.99,35.12c-0.02,0-0.03,0-0.05,0C21.95,35.19,21.97,35.17,21.99,35.12z"/>
+	<path class="st2" d="M27.94,33.13l-1,1c0,0-0.16,1.53,0,2c0.53,1.59,3,6,3,6l-4,4h-5v-2c0,0,1.74-2.14,2-3c0.07-0.24,0.09-0.77,0-1
+		c-0.24-0.66-1.31-1.86-2-2c-0.78-0.16-3,1-3,1l-4-1l-4-6v-1.04l3-2.96l-1-5l-1-1v6l-3,3l1,2l4,6l5,1c0,0,2.22-1.16,3-1
+		c0.35,0.07,0.89,0.66,1,1c0.08,0.24,0.07,0.76,0,1c-0.26,0.86-2,3-2,3v3h6l5-5c0,0-2.47-4.41-3-6
+		C27.71,35.42,27.94,33.13,27.94,33.13z"/>
+</g>
+</svg>
diff --git a/src/assets/svg/tab/weapon-icon-active.svg b/src/assets/svg/tab/weapon-icon-active.svg
new file mode 100644
index 0000000..7b6a14b
--- /dev/null
+++ b/src/assets/svg/tab/weapon-icon-active.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EC2E5B;}
+	.st1{fill:#DC5C7F;}
+	.st2{fill:#0F6569;}
+</style>
+<g>
+	<path class="st0" d="M6.2,12.44h3.98V13H11c3.1-4.32,7.78-6.6,13.5-6.6s10.78,2.82,13.88,7.14h1.37l1.05-1.05h2.14
+		C39.19,6.21,32.34,2,24.5,2C15.81,2,8.34,6.17,4.95,13.59H6.2V12.44z"/>
+	<path class="st0" d="M7.2,26.12v-3.15l-1.1-1.1H3.18C3.07,22.74,3,22.61,3,23.5c0,2.54,0.47,4.98,1.28,7.24L7.2,26.12z"/>
+	<path class="st0" d="M41.52,21.93c0.05,0.52,0.08,1.04,0.08,1.57c0,9.45-7.66,17.1-17.1,17.1c-3.85,0-7.39-1.29-10.24-3.43l-2,3.99
+		C15.73,43.58,19.95,45,24.5,45C36.37,45,46,35.37,46,23.5c0-0.53-0.04-1.05-0.08-1.57H41.52z"/>
+	<path class="st0" d="M44.48,14l-1-1h-2l-1,1H9v-1H7v1H4.48v5h-1v2h3l2,2v3L1.11,37.67V42h9.37l8-15c2.52,2,6,1.93,6,1.93
+		c7,0,7.37-7.93,7.37-7.93h13.63l1-1.3v-2.11h1V14H44.48z M28.48,26c-1.04,1.65-5.48,2-7.81,0c-0.84-0.72-2.41-3.16,1.7-4.08
+		c0,0,0.03,1.15,0.41,2.2c0.3,0.84,0.81,1.61,1.7,1.69c0,0-0.81-2.05-0.48-2.81c0.16-0.37,1-1,2-1S31,22,28.48,26z"/>
+</g>
+</svg>
diff --git a/src/assets/svg/tab/weapon.svg b/src/assets/svg/tab/weapon-icon-hover.svg
similarity index 100%
rename from src/assets/svg/tab/weapon.svg
rename to src/assets/svg/tab/weapon-icon-hover.svg
diff --git a/src/assets/svg/tab/weapon-icon.svg b/src/assets/svg/tab/weapon-icon.svg
new file mode 100644
index 0000000..9d52fbb
--- /dev/null
+++ b/src/assets/svg/tab/weapon-icon.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EC2E5B;}
+	.st1{fill:#DC5C7F;}
+	.st2{fill:#0F6569;}
+</style>
+<g>
+	<path class="st2" d="M6.14,12.57h3.98v0.56h0.82c3.1-4.32,7.78-6.6,13.5-6.6s10.78,2.82,13.88,7.14h1.37l1.05-1.05h2.14
+		C39.13,6.34,32.29,2.13,24.44,2.13c-8.69,0-16.16,4.17-19.55,11.59h1.24V12.57z"/>
+	<path class="st2" d="M7.14,26.25V23.1L6.04,22H3.12c-0.1,0.86-0.18,0.73-0.18,1.62c0,2.54,0.47,4.98,1.28,7.24L7.14,26.25z"/>
+	<path class="st2" d="M41.47,22.05c0.05,0.52,0.08,1.04,0.08,1.57c0,9.45-7.66,17.1-17.1,17.1c-3.85,0-7.39-1.29-10.24-3.43l-2,3.99
+		c3.48,2.41,7.69,3.84,12.24,3.84c11.87,0,21.5-9.63,21.5-21.5c0-0.53-0.04-1.05-0.08-1.57H41.47z"/>
+	<path class="st2" d="M44.43,14.13l-1-1h-2l-1,1H8.94v-1h-2v1H4.43v5h-1v2h3l2,2v3L1.06,37.79v4.33h9.37l8-15c2.52,2,6,1.93,6,1.93
+		c7,0,7.37-7.93,7.37-7.93h13.63l1-1.3v-2.11h1v-3.59H44.43z M28.43,26.13c-1.04,1.65-5.48,2-7.81,0c-0.84-0.72-2.41-3.16,1.7-4.08
+		c0,0,0.03,1.15,0.41,2.2c0.3,0.84,0.81,1.61,1.7,1.69c0,0-0.81-2.05-0.48-2.81c0.16-0.37,1-1,2-1S30.94,22.13,28.43,26.13z"/>
+</g>
+</svg>
diff --git a/src/components/home/TabBar.vue b/src/components/home/TabBar.vue
index 05a1c62..cc511a9 100644
--- a/src/components/home/TabBar.vue
+++ b/src/components/home/TabBar.vue
@@ -71,49 +71,49 @@ function handactiveTab(index) {
 .icon-hero {
   width: 45px;
   height: 45px;
-  background: url("@/assets/img/home/tabs/HERO-black-tab.png") no-repeat;
+  background: url("@/assets/svg/tab/hero-icon.svg") no-repeat;
   background-size: cover;
   &:hover{
-    background: url("@/assets/img/home/tabs/HERO-red-tab.png") no-repeat;
-  background-size: cover;
+    background: url("@/assets/svg/tab/hero-icon-hover.svg") no-repeat;
+    background-size: cover;
   }
 }
 .active-icon-hero {
   width: 45px;
   height: 45px;
-  background: url("@/assets/img/home/tabs/HERO-red-tab.png") no-repeat;
+  background: url("@/assets/svg/tab/hero-icon-active.svg") no-repeat;
   background-size: cover;
 }
 .icon-weapon {
   width: 45px;
   height: 45px;
-  background: url("@/assets/img/home/tabs/weapon-black-tab.png") no-repeat;
+  background: url("@/assets/svg/tab/weapon-icon.svg") no-repeat;
   background-size: cover;
   &:hover{
-    background: url("@/assets/img/home/tabs/weapon-red-tab.png") no-repeat;
+    background: url("@/assets/svg/tab/weapon-icon-hover.svg") no-repeat;
   background-size: cover;
   }
 }
 .active-icon-weapon {
   width: 45px;
   height: 45px;
-  background: url("@/assets/img/home/tabs/weapon-red-tab.png") no-repeat;
+  background: url("@/assets/svg/tab/weapon-icon-active.svg") no-repeat;
   background-size: cover;
 }
 .icon-chip {
   width: 45px;
   height: 45px;
-  background: url("@/assets/img/home/tabs/chip-black-tab.png") no-repeat;
+  background: url("@/assets/svg/tab/chip-icon.svg") no-repeat;
   background-size: cover;
   &:hover{
-    background: url("@/assets/img/home/tabs/chip-red-tab.png") no-repeat;
+    background: url("@/assets/svg/tab/chip-icon-hover.svg") no-repeat;
     background-size: cover;
   }
 }
 .active-icon-chip {
   width: 45px;
   height: 45px;
-  background: url("@/assets/img/home/tabs/chip-red-tab.png") no-repeat;
+  background: url("@/assets/svg/tab/chip-icon-active.svg") no-repeat;
   background-size: cover;
 }
 .icon::after {
@@ -152,7 +152,7 @@ function handactiveTab(index) {
   margin-right: 40px;
   width: 96px;
   // height: 96px;
-  color: #dc5c7f;
+  color:#EC2E5B;
   img {
     width: 45px;
     height: 45px;
diff --git a/src/components/home/WeaponSwiper.vue b/src/components/home/WeaponSwiper.vue
index 0d27701..068f137 100644
--- a/src/components/home/WeaponSwiper.vue
+++ b/src/components/home/WeaponSwiper.vue
@@ -250,7 +250,7 @@ function test(index, sc) {
   display: block;
   width: 170px;
   height: 17px;
-  background: url("./@/assets/img/home/weapon-bottom-boder.png") no-repeat;
+  background: url("@/assets/img/home/weapon-bottom-boder.png") no-repeat;
   background-size: contain;
 }
 
diff --git a/src/components/home/WhatCebg.vue b/src/components/home/WhatCebg.vue
index 8ebe84e..70eddaa 100644
--- a/src/components/home/WhatCebg.vue
+++ b/src/components/home/WhatCebg.vue
@@ -72,7 +72,7 @@
                   <span class="title">
                     Each battle contains 40 players by matching </span
                   ><br />
-                 <span v-if="isPveTab">A player should expect to face the majority or entirety of their opponents in the form of computer-controlled opponents. </span>
+                 <span v-if="!isPveTab">A player should expect to face the majority or entirety of their opponents in the form of computer-controlled opponents. </span>
                  <span v-else>Stands for Player versus Player. It’s a game mode that revolves around layer-against-player combat - combat between actual human players. </span>
                 </div>
               </div>
@@ -532,8 +532,9 @@ function handleScroll() {
           .pve-img {
             width: 710px;
             height: 400px;
+            cursor: pointer;
             &:hover{
-              transform: scale(1.098);
+              transform: scale(1.078);
             }
             
           }