diff --git a/lib/all-badge-examples.js b/lib/all-badge-examples.js
index e34e690707c57..495eb2390070a 100644
--- a/lib/all-badge-examples.js
+++ b/lib/all-badge-examples.js
@@ -2110,7 +2110,7 @@ const allBadgeExamples = [
       },
       {
         title: 'Vaadin Directory',
-        previewUri: '/vaadin-directory/star/vaadinvaadin-grid.svg',
+        previewUri: '/vaadin-directory/stars/vaadinvaadin-grid.svg',
         keywords: [
           'vaadin-directory',
           'vaadin directory',
diff --git a/server.js b/server.js
index cdcee6d847109..6c19e46d53947 100644
--- a/server.js
+++ b/server.js
@@ -7824,7 +7824,7 @@ cache(function(data, match, sendBadge, request) {
 }));
 
 // Vaadin Directory Integration
-camp.route(/^\/vaadin-directory\/(star|status|rating|rc|rating-count|v|version|rd|release-date)\/(.*).(svg|png|gif|jpg|json)$/, cache(function (data, match, sendBadge, request) {
+camp.route(/^\/vaadin-directory\/(star|stars|status|rating|rc|rating-count|v|version|rd|release-date)\/(.*).(svg|png|gif|jpg|json)$/, cache(function (data, match, sendBadge, request) {
   var type = match[1]; // Field required
   var urlIdentifier = match[2]; // Name of repository
   var format = match[3]; // Format
@@ -7847,8 +7847,11 @@ camp.route(/^\/vaadin-directory\/(star|status|rating|rc|rating-count|v|version|r
       var lv = data.latestAvailableRelease.name.toLowerCase();
       var ld = data.latestAvailableRelease.publicationDate;
       switch (type) {
-        case 'star': // Star
-          badgeData.text[0] = getLabel('rating', data);
+        // Since the first deploy was with `star`, I put the case there
+        // for safety pre-caution
+        case 'star':
+        case 'stars': // Stars
+          badgeData.text[0] = getLabel('stars', data);
           badgeData.text[1] = starRating(rating);
           badgeData.colorscheme = floorCountColor(rating, 2, 3, 4);
           break;
@@ -7880,7 +7883,7 @@ camp.route(/^\/vaadin-directory\/(star|status|rating|rc|rating-count|v|version|r
         case 'version':
           badgeData.text[0] = getLabel('latest ver', data);
           badgeData.text[1] = lv;
-          badgeData.colorscheme = "blue";
+          badgeData.colorB = '#00b4f0';
           break;
         case 'rd':
         case 'release-date': // The release date of the latest version
diff --git a/services/vaadin-directory/vaadin-directory.tester.js b/services/vaadin-directory/vaadin-directory.tester.js
index f6ff193bcca77..8f2616686bfa1 100644
--- a/services/vaadin-directory/vaadin-directory.tester.js
+++ b/services/vaadin-directory/vaadin-directory.tester.js
@@ -16,10 +16,17 @@ const t = new ServiceTester({
 });
 module.exports = t;
 
-t.create('star of component displayed in star icons')
+t.create('stars of component displayed in star icons')
   .get('/star/vaadinvaadin-grid.json')
   .expectJSONTypes(Joi.object().keys({
-    name: 'rating',
+    name: 'stars',
+    value: isStarRating
+  }));
+
+t.create('stars of component displayed in star icons')
+  .get('/stars/vaadinvaadin-grid.json')
+  .expectJSONTypes(Joi.object().keys({
+    name: 'stars',
     value: isStarRating
   }));
 
@@ -80,14 +87,14 @@ t.create('latest release date of the component (format: yyyy-mm-dd)')
     }));
 
 t.create('Invalid addon')
-  .get('/star/404.json')
+  .get('/stars/404.json')
   .expectJSON({
     name: 'Vaadin Directory',
     value: 'not found'
   });
 
 t.create('No connection')
-  .get('/star/vaadinvaadin-grid.json')
+  .get('/stars/vaadinvaadin-grid.json')
   .networkOff()
   .expectJSON({
     name: 'Vaadin Directory',