diff --git a/partials/tabs/projects.html b/partials/tabs/projects.html
index 58c125e4..ea7aef83 100644
--- a/partials/tabs/projects.html
+++ b/partials/tabs/projects.html
@@ -72,7 +72,7 @@
         <div ng-show="currentProject.developers_involved.length>0" class="project-detail-element">
           <div class="small-heading uppercase">Developers Involved</div> <span class="pr-element-detail chip" ng-repeat="developers in currentProject.developers_involved">@{{developers}}</span> </div>
         <div ng-show="currentProject.issues.length>0" class="project-detail-element">
-          <div class="small-heading uppercase">Related issues</div> <span ng-click="redirect(issue)" class="pr-element-detail chip clickable" ng-repeat="issue in currentProject.issues">{{ issue | format_issue }}</span>
+          <div class="small-heading uppercase">Related issues</div> <span ng-click="redirect(issue)" class="pr-element-detail chip clickable" ng-class="lc.getIssueStateClass(issue)" ng-repeat="issue in currentProject.issues">{{ issue | format_issue }}</span>
           <br>
           <br>
           <br>
diff --git a/resources/css/style.css b/resources/css/style.css
index f2395d87..cbf0cc6e 100644
--- a/resources/css/style.css
+++ b/resources/css/style.css
@@ -1,3 +1,7 @@
+.closed {
+  background-color: #cb2431;
+  color: white
+}
 .hash_value_dup {
   position: 'absolute';
   left: '-9999px';
@@ -32,6 +36,17 @@
 .fa-clipboard:hover .hinttext {
   visibility: visible;
 }
+.merged {
+  background-color: #6f42c1;
+  color: white;
+}
+.no-state {
+  background-color: #e4e4e4;
+}
+.open, .opened {
+  background-color: #2cbe4e;
+  color: white;
+}
 .project-detail-element > .clickable:hover, .clickable:hover .chip:hover {
   cursor: pointer;
   background-color: #f3f5f8;
diff --git a/resources/js/app.js b/resources/js/app.js
index af811167..ae357da0 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -100,6 +100,7 @@
                     'in_progress': 2,
                     'completed': 3
                 }
+                self.issueStates = {}
 
                 $scope.sortOrder = function(project) {
                     return mapping[project.status];
@@ -281,6 +282,34 @@
                     $scope.searchText = search_requested
                 }
 
+                self.getIssueStateClass = function(issue){
+                    return self.issueStates[issue]
+                }
+
+                function getIssueState(issue) {
+                    self.issueStates[issue] = 'no-state'
+                    $http({
+                        method: 'GET',
+                        url: 'https://webservices.coala.io/issue/details',
+                        params: { url: issue }
+                    }).then(function (response) {
+                        var issue_data = response.data
+                        self.issueStates[issue] = issue_data.state
+                    })
+                }
+
+                function getAllRelatedIssuesState(){
+                    $http.get('data/projects.liquid')
+                        .then(function (res) {
+                            angular.forEach(res.data, function(project){
+                                angular.forEach(project.issues, function(issue){
+                                    getIssueState(issue)
+                                })
+                            })
+                        })
+                }
+                getAllRelatedIssuesState()
+
             },
             controllerAs: 'lc'
         }