diff --git a/vendor/magento/module-swatches/view/base/web/js/swatch-renderer.js b/vendor/magento/module-swatches/view/base/web/js/swatch-renderer.js
index 58a68fd18ae..734cde2b4cc 100644
--- a/vendor/magento/module-swatches/view/base/web/js/swatch-renderer.js
+++ b/vendor/magento/module-swatches/view/base/web/js/swatch-renderer.js
@@ -465,12 +465,17 @@ define([
                 // Aggregate options array to hash (key => value)
                 $.each(item.options, function () {
                     if (this.products.length > 0) {
+                        let salableProducts = this.products;
+
+                        if ($widget.options.jsonConfig.canDisplayShowOutOfStockStatus) {
+                            salableProducts = $widget.options.jsonConfig.salable[item.id][this.id];
+                        }
                         $widget.optionsMap[item.id][this.id] = {
                             price: parseInt(
                                 $widget.options.jsonConfig.optionPrices[this.products[0]].finalPrice.amount,
                                 10
                             ),
-                            products: this.products
+                            products: salableProducts
                         };
                     }
                 });
@@ -498,6 +503,27 @@ define([
             $widget._EmulateSelected($widget._getSelectedAttributes());
         },
 
+        disableSwatchForOutOfStockProducts: function () {
+            let $widget = this, container = this.element;
+
+            $.each(this.options.jsonConfig.attributes, function () {
+                let item = this;
+
+                if ($widget.options.jsonConfig.canDisplayShowOutOfStockStatus) {
+                    let salableProducts = $widget.options.jsonConfig.salable[item.id],
+                        swatchOptions = $(container).find(`[data-attribute-id='${item.id}']`).find('.swatch-option');
+
+                    swatchOptions.each(function (key, value) {
+                        let optionId = $(value).data('option-id');
+
+                        if (!salableProducts.hasOwnProperty(optionId)) {
+                            $(value).attr('disabled', true).addClass('disabled');
+                        }
+                    });
+                }
+            });
+        },
+
         /**
          * Render swatch options by part of config
          *
@@ -888,6 +914,7 @@ define([
                 .attr('disabled', true)
                 .addClass('disabled')
                 .attr('tabindex', '-1');
+            this.disableSwatchForOutOfStockProducts();
         },
 
         /**