diff --git a/im-ui/src/components/chat/ChatBox.vue b/im-ui/src/components/chat/ChatBox.vue
index 175b507..39ca6ba 100644
--- a/im-ui/src/components/chat/ChatBox.vue
+++ b/im-ui/src/components/chat/ChatBox.vue
@@ -824,8 +824,7 @@
 		position: relative;
 		width: 100%;
 		background: #f8f8f8;
-		border: #dddddd solid 1px;
-
+		
 		.el-header {
 			padding: 3px;
 			background-color: white;
@@ -846,7 +845,7 @@
 
 		.im-chat-main {
 			padding: 0;
-			background-color: #f8f8f8;
+			background-color: white;
 
 			.im-chat-box {
 				>ul {
diff --git a/im-ui/src/components/chat/ChatGroupSide.vue b/im-ui/src/components/chat/ChatGroupSide.vue
index a245b7b..3891879 100644
--- a/im-ui/src/components/chat/ChatGroupSide.vue
+++ b/im-ui/src/components/chat/ChatGroupSide.vue
@@ -2,7 +2,7 @@
 	<div class="chat-group-side">
 		<div v-show="!group.quit" class="group-side-search">
 			<el-input placeholder="搜索群成员" v-model="searchText">
-				<el-button slot="append" icon="el-icon-search"></el-button>
+				<i class="el-icon-search el-input__icon" slot="prefix"> </i>
 			</el-input>
 		</div>
 		<el-scrollbar class="group-side-scrollbar">
diff --git a/im-ui/src/components/chat/ChatMessageItem.vue b/im-ui/src/components/chat/ChatMessageItem.vue
index 7852365..2c999ef 100644
--- a/im-ui/src/components/chat/ChatMessageItem.vue
+++ b/im-ui/src/components/chat/ChatMessageItem.vue
@@ -266,7 +266,7 @@
 						line-height: 26px;
 						margin-top: 3px;
 						padding: 7px;
-						background-color: white;
+						background-color: #eee;
 						border-radius: 10px;
 						color: black;
 						display: block;
@@ -274,7 +274,6 @@
 						text-align: left;
 						white-space: pre-wrap;
 						word-break: break-all;
-						box-shadow: 1px 1px 1px #c0c0f0;
 
 						&:after {
 							content: "";
@@ -284,7 +283,7 @@
 							width: 0;
 							height: 0;
 							border-style: solid dashed dashed;
-							border-color: white transparent transparent;
+							border-color: #eee transparent transparent;
 							overflow: hidden;
 							border-width: 10px;
 						}
@@ -443,8 +442,7 @@
 							background-color: rgb(88, 127, 240);
 							color: #fff;
 							vertical-align: top;
-							box-shadow: 1px 1px 1px #ccc;
-
+							
 							&:after {
 								left: auto;
 								right: -10px;
diff --git a/im-ui/src/view/Chat.vue b/im-ui/src/view/Chat.vue
index cd56432..b6b42f2 100644
--- a/im-ui/src/view/Chat.vue
+++ b/im-ui/src/view/Chat.vue
@@ -69,7 +69,7 @@
 		.chat-list-box {
 			display: flex;
 			flex-direction: column;
-			border: #dddddd solid 1px;
+			border-right: #53a0e79c solid 1px;	
 			background: white;
 			width: 3rem;
 
diff --git a/im-ui/src/view/Friend.vue b/im-ui/src/view/Friend.vue
index ef2459e..24f29df 100644
--- a/im-ui/src/view/Friend.vue
+++ b/im-ui/src/view/Friend.vue
@@ -182,7 +182,7 @@
 		.friend-list-box {
 			display: flex;
 			flex-direction: column;
-			border: #dddddd solid 1px;
+			border-right: #53a0e79c solid 1px;
 			background: white;
 
 			.friend-list-header {
@@ -217,8 +217,7 @@
 
 		.friend-box {
 			display: flex;
-			flex-direction: column;
-			border: #dddddd solid 1px;
+			flex-direction: column;	
 
 			.friend-header {
 				padding: 3px;	
diff --git a/im-ui/src/view/Group.vue b/im-ui/src/view/Group.vue
index f40fbb3..cde4c0e 100644
--- a/im-ui/src/view/Group.vue
+++ b/im-ui/src/view/Group.vue
@@ -271,7 +271,7 @@
 		.group-list-box {
 			display: flex;
 			flex-direction: column;
-			border: #dddddd solid 1px;
+			border-right: #53a0e79c solid 1px;
 			background: #F8F8F8;
 
 			.group-list-header {
@@ -307,8 +307,7 @@
 		.group-box {
 			display: flex;
 			flex-direction: column;
-			border: #dddddd solid 1px;
-
+			
 			.group-header {
 				padding: 3px;
 				height: 50px;
diff --git a/im-ui/src/view/Home.vue b/im-ui/src/view/Home.vue
index b4996c5..f84f349 100644
--- a/im-ui/src/view/Home.vue
+++ b/im-ui/src/view/Home.vue
@@ -7,7 +7,7 @@
 					@click.native="showSettingDialog = true">
 				</head-image>
 			</div>
-			<el-menu background-color="#f0f4f8" style="margin-top: 25px;">
+			<el-menu background-color="#E8F2FF" style="margin-top: 25px;">
 				<el-menu-item title="聊天">
 					<router-link class="link" v-bind:to="'/home/chat'">
 						<span class="icon iconfont icon-chat"></span>
@@ -350,17 +350,18 @@
 
 <style scoped lang="scss">
 	.navi-bar {
-		background: #f0f4f8;
+		background: #E8F2FF;
 		padding: 10px;
 		padding-top: 50px;
-
+		border-right: #53a0e79c solid 1px;
+		
 		.el-menu {
 			border: none;
 			flex: 1;
 
 			.el-menu-item {
 				margin: 20px 0;
-				background-color: #f0f4f8 !important;
+				background-color: #E8F2FF !important;
 				padding: 0 !important;
 				text-align: center;