diff --git a/assets/js/base/components/quantity-selector/index.tsx b/assets/js/base/components/quantity-selector/index.tsx
index c2d20c64b5c..42e1ef0a829 100644
--- a/assets/js/base/components/quantity-selector/index.tsx
+++ b/assets/js/base/components/quantity-selector/index.tsx
@@ -194,8 +194,11 @@ const QuantitySelector = ( {
 					),
 					itemName
 				) }
-				className="wc-block-components-quantity-selector__button wc-block-components-quantity-selector__button--minus"
-				disabled={ disabled || ! canDecrease }
+				className={ classNames(
+					'wc-block-components-quantity-selector__button',
+					'wc-block-components-quantity-selector__button--minus',
+					{ 'is-disabled': disabled || ! canDecrease }
+				) }
 				onClick={ () => {
 					const newQuantity = quantity - step;
 					onChange( newQuantity );
@@ -211,6 +214,8 @@ const QuantitySelector = ( {
 					);
 					normalizeQuantity( newQuantity );
 				} }
+				aria-disabled={ disabled || ! canDecrease }
+				tabIndex={ disabled || ! canDecrease ? -1 : undefined }
 			>
 				－
 			</button>
@@ -223,8 +228,11 @@ const QuantitySelector = ( {
 					),
 					itemName
 				) }
-				disabled={ disabled || ! canIncrease }
-				className="wc-block-components-quantity-selector__button wc-block-components-quantity-selector__button--plus"
+				className={ classNames(
+					'wc-block-components-quantity-selector__button',
+					'wc-block-components-quantity-selector__button--plus',
+					{ 'is-disabled': disabled || ! canIncrease }
+				) }
 				onClick={ () => {
 					const newQuantity = quantity + step;
 					onChange( newQuantity );
@@ -240,6 +248,8 @@ const QuantitySelector = ( {
 					);
 					normalizeQuantity( newQuantity );
 				} }
+				aria-disabled={ disabled || ! canIncrease }
+				tabIndex={ disabled || ! canIncrease ? -1 : undefined }
 			>
 				&#65291;
 			</button>
diff --git a/assets/js/base/components/quantity-selector/style.scss b/assets/js/base/components/quantity-selector/style.scss
index c6de2458122..0bcfc210cea 100644
--- a/assets/js/base/components/quantity-selector/style.scss
+++ b/assets/js/base/components/quantity-selector/style.scss
@@ -81,7 +81,7 @@
 		&:focus {
 			opacity: 1;
 		}
-		&:disabled {
+		&.is-disabled {
 			box-shadow: none;
 			cursor: default;
 			opacity: 0.6;