diff --git a/static/js/shop.jsx b/static/js/shop.jsx
index fa89142..3f181b1 100644
--- a/static/js/shop.jsx
+++ b/static/js/shop.jsx
@@ -1496,6 +1496,8 @@ class Shop extends React.PureComponent {
     const nbrOccupied = nbrOccupiedSlotsInCrate(newItems);
     if (nbrOccupied > crateModeSlots[currentMode]) {
       rules[crateRules.maxSlot.type] = {...crateRules.maxSlot};
+    } else if (crateModeSlots[currentMode] === 21 && nbrOccupied <= 10) {
+      rules[crateRules.compactSlot.type] = {...crateRules.compactSlot};
     }
 
 
diff --git a/static/js/shop.min.js b/static/js/shop.min.js
index 6c36165..96f1b6e 100644
--- a/static/js/shop.min.js
+++ b/static/js/shop.min.js
@@ -1534,6 +1534,8 @@ function (_React$PureComponent12) {
 
       if (nbrOccupied > crateModeSlots[currentMode]) {
         rules[crateRules.maxSlot.type] = _objectSpread({}, crateRules.maxSlot);
+      } else if (crateModeSlots[currentMode] === 21 && nbrOccupied <= 10) {
+        rules[crateRules.compactSlot.type] = _objectSpread({}, crateRules.compactSlot);
       } // check the number of EEM connectors available for all Kasli
 
 
diff --git a/static/js/shop_data.js b/static/js/shop_data.js
index d170712..3114376 100644
--- a/static/js/shop_data.js
+++ b/static/js/shop_data.js
@@ -18,6 +18,12 @@ const shop_data = {
       name: 'Crate',
       message: 'You have reach the maximum number of slots allowed for this crate. Consider removing cards.',
     },
+    compactSlot: {
+      type: 'crate',
+      icon: '/shop/icon-reminder.svg',
+      name: 'Crate',
+      message: 'The selected cards fit in a 42hp desktop crate, consider switching to it for a more compact system',
+    },
   },
 
   crateModeItems: [{