diff --git a/wise-webapp/src/main/webapp/css/mindmapList.less b/wise-webapp/src/main/webapp/css/mindmapList.less
index 2a9652b7..829ed564 100644
--- a/wise-webapp/src/main/webapp/css/mindmapList.less
+++ b/wise-webapp/src/main/webapp/css/mindmapList.less
@@ -102,6 +102,36 @@ input#selectAll {
     display: none;
 }
 
+/* ---------------------------- Label --------------------------------- */
+
+.labelColor {
+    width: 12px;
+    height: 12px;
+    display: inline-block;
+    position: relative;
+    left: 2px;
+    top: 1px;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    border-radius: 3px;
+}
+
+.labelName {
+    display: inline-block;
+    position: relative;
+    left: 7px;
+}
+
+.labelTag {
+  border: 1px solid;
+  border-radius: 3px;
+  color: white;
+  display: inline-block;
+  font-size: 11px;
+  line-height: 1;
+  padding: 2px 5px 1px 5px;
+}
+
 /* ---------------------------- Sorting --------------------------------- */
 
 .sorting_asc {
diff --git a/wise-webapp/src/main/webapp/js/labelActions.js b/wise-webapp/src/main/webapp/js/labelActions.js
index 579fd90e..333c8aa5 100644
--- a/wise-webapp/src/main/webapp/js/labelActions.js
+++ b/wise-webapp/src/main/webapp/js/labelActions.js
@@ -1,9 +1,16 @@
 function createLabelItem(data) {
+    if (data.color == "") {
+        data.color = "#000000";
+    }
     $("#foldersContainer").find("ul").append(
         $("<li data-filter=\""  + data.title  + "\">").append(
-            "<a href=\"#\"> <i class=\"icon-tag\"></i>" + data.title + "</a>"
+            "<a href=\"#\"> <i class=\"icon-tag\"></i>" +
+                "<div class='labelColor' style='background: " +  data.color + "'></div>" +
+                "<div class='labelName'>" + data.title + "</div>" +
+            "</a>"
         )
     )
+
 }
 
 function fetchLabels() {