diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html
index 57627e228a27b8f633b37b8d65f8a8d98005ef4d..95f3ecd00bfa860b3154f74cdbe39e29996caa84 100644
--- a/src/app/components/shared/comment-list/comment-list.component.html
+++ b/src/app/components/shared/comment-list/comment-list.component.html
@@ -260,7 +260,9 @@
 </div>
 <!-- Active User Overlay -->
 <div class="activeUserOverlay">
-  <p>Active Users: {{activeUsers}}</p>
+  <div class="viewer-icon">
+  </div>
+  <p style="float:left;">Active Users: {{activeUsers}}</p>
 </div>
 
 <!-- No Questions Present -->
diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss
index 845ae6dc027a167b9edbb8d245ac81dbb3de639f..bb413dd361ea1d73c2cd73fb85f6b2ade60c967b 100644
--- a/src/app/components/shared/comment-list/comment-list.component.scss
+++ b/src/app/components/shared/comment-list/comment-list.component.scss
@@ -260,10 +260,22 @@ h1{
 }
 
 .activeUserOverlay{
-  width:100px;
-  height:100px;
+  width:180px;
+  height:25px;
   position:fixed;
-  background-color:red;
   top:80px;
   left:20px;
+  >*{
+    float:left;
+    padding:0;
+    margin:0;
+  }
+  >p{
+    font-family:'Roboto', sans-serif;
+    font-weight:bold;
+    float:left;
+    padding:5px;
+    margin:0;
+    color:var(--on-background);
+  }
 }
diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts
index 3838b3872800a819d163c344f12768fb8223d044..18d71b3c1fb6dfa09a41b311faf947c3cef85d0c 100644
--- a/src/app/components/shared/comment-list/comment-list.component.ts
+++ b/src/app/components/shared/comment-list/comment-list.component.ts
@@ -244,7 +244,7 @@ export class CommentListComponent implements OnInit, OnDestroy {
           this.roomId = room.id;
           this.activeUserService.getActiveUser(this.room)
           .subscribe(i=>{
-            this.activeUsers=i;
+            this.activeUsers=i.length;
           });
           this._subscriptionRoomService = this.wsRoomService.getRoomStream(this.roomId).subscribe(msg => {
             const message = JSON.parse(msg.body);
diff --git a/src/app/services/http/active-user.service.ts b/src/app/services/http/active-user.service.ts
index d8e864e98f3c9455aacd2bf13b17b4585168cf24..8c60106e4277d78d7bfb4a21cd47d32a499195c5 100644
--- a/src/app/services/http/active-user.service.ts
+++ b/src/app/services/http/active-user.service.ts
@@ -18,8 +18,8 @@ export class ActiveUserService extends BaseHttpService {
     super();
   }
 
-  public getActiveUser(room: Room):Observable<number>{
-    const url = '/api/roomsubscription/usercount';
+  public getActiveUser(room: Room):Observable<any>{
+    const url = '/api/roomsubscription/usercount?ids='+room.id;
     return this.http.get(url, httpOptions).pipe(
       tap(_ => ''),
       catchError(this.handleError<any>('yeet'))
diff --git a/src/assets/icons/view.png b/src/assets/icons/view.png
new file mode 100644
index 0000000000000000000000000000000000000000..e1c4a4e15328218b7e73df60d475c0401f7d8102
Binary files /dev/null and b/src/assets/icons/view.png differ
diff --git a/src/assets/icons/viewer.svg b/src/assets/icons/viewer.svg
new file mode 100644
index 0000000000000000000000000000000000000000..f2854a1b0ca13ed12377655128349290bf916edb
--- /dev/null
+++ b/src/assets/icons/viewer.svg
@@ -0,0 +1,9 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16">
+  <path fill="#000000" d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7
+    64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1
+    68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1
+    112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5
+    16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0
+    48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256
+    128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z"/>
+</svg>
diff --git a/src/styles.scss b/src/styles.scss
index 5c2c9ce9eda2ce5a34aec42843c131bfaf882622..63f41701fab8f405073d860c4fed562d59418979 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -249,3 +249,10 @@ a {
   height: 1px !important;
   border-top-color: rgba(0, 0, 0, 0.12) !important;
 }
+
+.viewer-icon{
+  width:25px;
+  height:25px;
+  background-size:cover;
+  background-image:url("assets/icons/view.png");
+}