diff --git a/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.html b/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.html
index fa61ee6a..64c53e4c 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.html
@@ -321,18 +321,23 @@
   </div>
 </mat-toolbar>
 
-<mat-menu #profileMenu="matMenu">
-  <button mat-menu-item [matMenuTriggerFor]="presenseMenu">대화 가능</button>
-  <button mat-menu-item>상태 메시지 설정</button>
-  <button mat-menu-item (click)="onClickSettings()">설정</button>
+<mat-menu #profileMenu="matMenu" class="myset">
+  <div class="setting"><button mat-menu-item [matMenuTriggerFor]="presenseMenu">대화 가능</button></div>
+  <div class="setting"><button mat-menu-item>상태 메시지 설정</button></div>
+  <div class="setting"><button mat-menu-item>축소</button><span>100%</span><button mat-menu-item>확대</button></div>
+  <div class="setting"><button mat-menu-item (click)="onClickSettings()">설정</button></div>
   <mat-divider></mat-divider>
-  <button mat-menu-item (click)="onClickLogout()">로그아웃</button>
+  <div class="setting"><button mat-menu-item (click)="onClickLogout()">로그아웃</button></div>
 </mat-menu>
 
-<mat-menu #presenseMenu="matMenu">
-  <button mat-menu-item>온라인</button>
-  <button mat-menu-item>부재중</button>
-  <button mat-menu-item>다른용무중</button>
-  <button mat-menu-item>회의중</button>
-  <button mat-menu-item>집중근무중</button>
-</mat-menu>
+<mat-menu #presenseMenu="matMenu" class="status-pc-set">
+  <div class="setting"><button mat-menu-item><span class="presence pcOn"> </span>온라인</button></div>
+  <div class="setting"><button mat-menu-item><span class="presence pcOut"> </span>부재중</button><button mat-menu-item
+      class="clock"></button></div>
+  <div class="setting"><button mat-menu-item><span class="presence pcOther"> </span>다른용무중</button><button mat-menu-item
+      class="edit"></button></div>
+  <div class="setting"><button mat-menu-item><span class="presence pcOther"> </span>회의중</button><button mat-menu-item
+      class="edit"></button></div>
+  <div class="setting"><button mat-menu-item><span class="presence pcOther"> </span>집중근무중</button><button mat-menu-item
+      class="edit"></button></div>
+</mat-menu>
\ No newline at end of file
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss
index fe7be3a1..b7ad41a2 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss
+++ b/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss
@@ -85,6 +85,7 @@
             background-position: 50% 50%;
             text-indent: -1000000px;
             justify-content: center;
+            color: #2d3a4a;
             &.dsp {
               text-indent: 0;
             }
@@ -209,4 +210,46 @@
   }
 }
 
-@include weblink(#425888);
+@include weblink(#2d3a4a);
+
+::ng-deep .myset {
+  .mat-menu-content {
+    .setting {
+      display: flex;
+      flex-flow: row;
+      align-items: center;
+    }
+  }
+}
+
+::ng-deep .status-pc-set {
+  .mat-menu-content {
+    .setting {
+      display: flex;
+      flex-flow: row;
+      align-items: center;
+      button {
+        .presence {
+          margin-right: 10px;
+          cursor: pointer;
+        }
+        &:nth-child(2) {
+          margin-right: 20px;
+          margin-left: auto;
+          background-color: transparent;
+          background-repeat: no-repeat;
+          background-position: 50%;
+          border: none;
+          width: 24px;
+          height: 24px;
+          &.clock {
+            background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-clock'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
+          }
+          &.edit {
+            background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-edit-2'%3E%3Cpath d='M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z'%3E%3C/path%3E%3C/svg%3E");
+          }
+        }
+      }
+    }
+  }
+}