diff --git a/plugins/woocommerce/client/legacy/css/admin.scss b/plugins/woocommerce/client/legacy/css/admin.scss
index ac2a36d0c30..2deb518c565 100644
--- a/plugins/woocommerce/client/legacy/css/admin.scss
+++ b/plugins/woocommerce/client/legacy/css/admin.scss
@@ -7498,21 +7498,21 @@ table.bar_chart {
 		}
 
 		li.active {
-			border-color: #a16696;
-			color: #a16696;
+			border-color: var(--wp-admin-theme-color);
+			color: var(--wp-admin-theme-color);
 
 			&::before {
-				border-color: #a16696;
+				border-color: var(--wp-admin-theme-color);
 			}
 		}
 
 		li.done {
-			border-color: #a16696;
-			color: #a16696;
+			border-color: var(--wp-admin-theme-color);
+			color: var(--wp-admin-theme-color);
 
 			&::before {
-				border-color: #a16696;
-				background: #a16696;
+				border-color: var(--wp-admin-theme-color);
+				background: var(--wp-admin-theme-color);
 			}
 		}
 	}
@@ -7525,24 +7525,21 @@ table.bar_chart {
 		margin-bottom: 2px;
 		height: auto !important;
 		border-radius: 4px;
-		background-color: #bb77ae;
-		border-color: #a36597;
-		-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25),
-			0 1px 0 #a36597;
-		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597;
-		text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597,
-			-1px 0 1px #a36597;
+		background-color: var(--wp-admin-theme-color);
+		border-color: var(--wp-admin-theme-color);
+		-webkit-box-shadow: 0 0 0;
+		box-shadow: 0 0 0;
+		text-shadow: none;
 		margin: 0;
 		opacity: 1;
 
 		&:hover,
 		&:focus,
 		&:active {
-			background: #a36597;
-			border-color: #a36597;
-			-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25),
-				0 1px 0 #a36597;
-			box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597;
+			background: var(--wp-admin-theme-color-darker-10);
+			border-color: var(--wp-admin-theme-color-darker-10);
+			-webkit-box-shadow: 0 0 0;
+			box-shadow: 0 0 0;
 		}
 	}
 
@@ -7700,24 +7697,21 @@ table.bar_chart {
 		progress::-webkit-progress-value {
 			border-radius: 3px;
 			box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
-			background: #a46497;
-			background: linear-gradient(to bottom, #a46497, #66405f), #a46497;
+			background: var(--wp-admin-theme-color);
 			transition: width 1s ease;
 		}
 
 		progress::-moz-progress-bar {
 			border-radius: 3px;
 			box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
-			background: #a46497;
-			background: linear-gradient(to bottom, #a46497, #66405f), #a46497;
+			background: var(--wp-admin-theme-color);
 			transition: width 1s ease;
 		}
 
 		progress::-ms-fill {
 			border-radius: 3px;
 			box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
-			background: #a46497;
-			background: linear-gradient(to bottom, #a46497, #66405f), #a46497;
+			background: var(--wp-admin-theme-color);
 			transition: width 1s ease;
 		}
 
@@ -7810,7 +7804,7 @@ table.bar_chart {
 
 			&::before {
 				@include icon("\e015");
-				color: #a16696;
+				color: var(--wp-admin-theme-color);
 				position: static;
 				font-size: 100px;
 				display: block;