diff --git a/src/_includes/card.html b/src/_includes/card.html
index f2dcbd8..726fcfd 100644
--- a/src/_includes/card.html
+++ b/src/_includes/card.html
@@ -22,6 +22,13 @@ <h2 title="{{=it.info.title }}">
         <footer>
           <h3> OpenAPI: </h3>
           <h4>Preferred Version - {{=it.preferred}}</h4>
+          {{? it.rating }}
+            <div class="rating">
+              <a class="badge" href="https://ratemyopenapi.com/report/{{=it.rating.reportId }}?source=external" target="_blank">
+                <img src="https://img.shields.io/badge/ratemyopenapi-{{=it.rating.score }}-{{=it.rating.color }}" alt="API score {{=it.rating.score }}">
+              </a>
+            </div>
+          {{?}}
           <ul class="preferred-api">
             <li><a href="{{=it.api.swaggerUrl}}" target="_blank" >JSON</a></li>
             <li><a href='{{=it.api.swaggerYamlUrl}}' target="_blank" >YAML</a></li>
diff --git a/src/assets/javascript/apis.js b/src/assets/javascript/apis.js
index b9b9420..082b1a0 100644
--- a/src/assets/javascript/apis.js
+++ b/src/assets/javascript/apis.js
@@ -63,12 +63,14 @@ function CardModel() {
     this.cardDescription = '';
     this.added = null;
     this.updated = null;
+    this.rating = null;
 }
 
 CardModel.prototype.fromAPIs = function(name, apis) {
     this.preferred = apis.preferred;
     this.api = apis.versions[this.preferred];
     this.info = this.api.info;
+    this.rating = this.api.rating;
     this.externalDocs = this.api.externalDocs || {};
     this.contact = this.info.contact || {};
     this.externalUrl = this.externalDocs.url || this.contact.url || (name.indexOf('.local') < 0 ? 'https://'+name.split(':')[0] : '');
@@ -128,6 +130,19 @@ CardModel.prototype.fromAPIs = function(name, apis) {
     return this;
 };
 
+function getScoreStrokeColor(score) {
+  switch (true) {
+    case score === 0:
+      return "gray";
+    case score >= 80:
+      return "green";
+    case score >= 50 && score < 80:
+      return "yellow";
+    case score > 0 && score < 50:
+      return "red";
+  }
+}
+
 if (window.$) {
   $(document).ready(function () {
     var cardTemplateSrc = document.querySelector('script[type="text/dot-template"]').innerText;
@@ -187,38 +202,62 @@ if (window.$) {
        newData = true;
     }
 
-    $.ajax({
-      type: "GET",
-      url: (newData ? "https://raw.githubusercontent.com/APIs-guru/openapi-directory/gh-pages/v2/list.json" : "https://api.apis.guru/v2/list.json"),
-      dataType: 'json',
-      cache: true,
-      success: function (data) {
-        $('#apis-list').empty();
+    $.ajaxSetup({ cache: true });
+    $.when(
+      $.getJSON(newData ? "https://raw.githubusercontent.com/APIs-guru/openapi-directory/gh-pages/v2/list.json" : "https://api.apis.guru/v2/list.json"),
+      $.getJSON("https://storage.googleapis.com/rate-my-openapi-public/apis-guru/ratings.json"),
+    )
+    .done(function(apiList, apiRatings) {
+      const [ratings] = apiRatings;
+      let [resultApiList] = apiList;
+
+      ratings.forEach(function(ratingItem) {
+        const { name: apiName, version } = ratingItem;
+        let api = resultApiList[apiName];
+        if (api && ratingItem.score !== null) {
+          const badgeColor = getScoreStrokeColor(ratingItem.score);
+          resultApiList[apiName] = {
+            ...api,
+            versions: {
+              ...api.versions,
+              [version]: {
+                ...api.versions[version],
+                rating: {
+                  score: ratingItem.score,
+                  reportId: ratingItem.reportId,
+                  color: badgeColor, 
+                }
+              }
+            }
+          };
+        }
+      });
+
+      $('#apis-list').empty();
         let search = $('#search-input').val().toLowerCase();
         if (search || category || tag || status) {
-            let result = filter(data, search, category, tag, status);
-            updateCards(result);
+          let result = filter(resultApiList, search, category, tag, status);
+          updateCards(result);
         }
         else {
-            updateCards(data);
+          updateCards(resultApiList);
         }
 
         var searchInput = $('#search-input')[0];
         searchInput.addEventListener('keyup', debounce(function() {
-            $('#apis-list').empty();
+          $('#apis-list').empty();
 
-            let search = $('#search-input').val().toLowerCase();
-            history.replaceState(null, '', '/' + (search ? '?q='+encodeURIComponent(search) : ''));
-            if (search) {
-              $('#btnCopy').show();
-            }
-            else {
-              $('#btnCopy').hide();
-            }
-            let result = filter(data, search, category, tag, status);
-            updateCards(result);
+          let search = $('#search-input').val().toLowerCase();
+          history.replaceState(null, '', '/' + (search ? '?q='+encodeURIComponent(search) : ''));
+          if (search) {
+            $('#btnCopy').show();
+          }
+          else {
+            $('#btnCopy').hide();
+          }
+          let result = filter(resultApiList, search, category, tag, status);
+          updateCards(result);
         }, 333), false);
-      }
     });
 
     for (let i=0;i<15;i++) { updateCards(dummy); }
diff --git a/src/assets/scss/code-red-updates.scss b/src/assets/scss/code-red-updates.scss
index e5788ef..0624703 100644
--- a/src/assets/scss/code-red-updates.scss
+++ b/src/assets/scss/code-red-updates.scss
@@ -113,7 +113,7 @@
     font-size: 0.8em;
 }
 
-.card footer a {
+.card footer a:not(.badge) {
     padding: .1em .5em .1em;
     background-color: #388c9a;
     border-radius: 2px;
@@ -128,6 +128,10 @@
     cursor: pointer;
 }
 
+.card footer .rating {
+    padding-bottom: 7px;
+}
+
 .support {
     text-align: center;
     & p {