diff --git a/Synergism.css b/Synergism.css
index dda037639..d5278f62a 100644
--- a/Synergism.css
+++ b/Synergism.css
@@ -3752,6 +3752,17 @@ img#singularityPerksIcon {
 .hoveredBlueberryLoadout6 div.bbPurchasedLoadout6,
 .hoveredBlueberryLoadout7 div.bbPurchasedLoadout7,
 .hoveredBlueberryLoadout8 div.bbPurchasedLoadout8 {
+    background-color: purple;
+}
+
+.hoveredBlueberryLoadout1 div.bbMaxedLoadout1,
+.hoveredBlueberryLoadout2 div.bbMaxedLoadout2,
+.hoveredBlueberryLoadout3 div.bbMaxedLoadout3,
+.hoveredBlueberryLoadout4 div.bbMaxedLoadout4,
+.hoveredBlueberryLoadout5 div.bbMaxedLoadout5,
+.hoveredBlueberryLoadout6 div.bbMaxedLoadout6,
+.hoveredBlueberryLoadout7 div.bbMaxedLoadout7,
+.hoveredBlueberryLoadout8 div.bbMaxedLoadout8 {
     background-color: green;
 }
 
diff --git a/src/BlueberryUpgrades.ts b/src/BlueberryUpgrades.ts
index e81cfed1b..118b0a6e2 100644
--- a/src/BlueberryUpgrades.ts
+++ b/src/BlueberryUpgrades.ts
@@ -659,12 +659,24 @@ export const updateLoadoutHoverClasses = () => {
     const loadout = player.blueberryLoadouts[i]
 
     const upgradeHoverClass = `bbPurchasedLoadout${i}`
+    const maxedHoverClass = `bbMaxedLoadout${i}`
     for (const upgradeKey of upgradeNames) {
+      const parent = DOMCacheGetOrSet(upgradeKey).parentElement
+      if (!parent) {
+        continue
+      }
+
+      parent.classList.remove(upgradeHoverClass)
+      parent.classList.remove(maxedHoverClass)
+
       // eslint-disable-next-line
       if (loadout[upgradeKey]) {
-        DOMCacheGetOrSet(upgradeKey).parentElement?.classList.add(upgradeHoverClass)
-      } else {
-        DOMCacheGetOrSet(upgradeKey).parentElement?.classList.remove(upgradeHoverClass)
+        // eslint-disable-next-line
+        if (loadout[upgradeKey] === blueberryUpgradeData[upgradeKey].maxLevel) {
+          parent.classList.add(maxedHoverClass)
+        } else {
+          parent.classList.add(upgradeHoverClass)
+        }
       }
     }
   }