diff --git a/assets/js/blocks/cart-checkout/mini-cart/edit.tsx b/assets/js/blocks/cart-checkout/mini-cart/edit.tsx
index bfd35c097f2..0d08fdd18b0 100644
--- a/assets/js/blocks/cart-checkout/mini-cart/edit.tsx
+++ b/assets/js/blocks/cart-checkout/mini-cart/edit.tsx
@@ -21,7 +21,8 @@ import QuantityBadge from './quantity-badge';
 interface Attributes {
 	isInitiallyOpen?: boolean;
 	transparentButton: boolean;
-	colorClassNames?: string;
+	backgroundColor?: string;
+	textColor?: string;
 	style?: Record< string, Record< string, string > >;
 }
 
@@ -36,14 +37,15 @@ const MiniCartBlock = ( {
 }: Props ): ReactElement => {
 	const { transparentButton, backgroundColor, textColor, style } = attributes;
 	const blockProps = useBlockProps( {
-		className: classnames(
-			'wc-block-mini-cart wp-block-woocommerce-mini-cart',
-			{
-				'is-transparent': transparentButton,
-			}
-		),
+		className: classnames( 'wc-block-mini-cart', {
+			'is-transparent': transparentButton,
+		} ),
 	} );
 
+	/**
+	 * @todo Replace `getColorClassName` and manual style manipulation with
+	 * `useColorProps` once the hook is no longer experimental.
+	 */
 	const backgroundClass = getColorClassName(
 		'background-color',
 		backgroundColor
diff --git a/assets/js/blocks/cart-checkout/mini-cart/style.scss b/assets/js/blocks/cart-checkout/mini-cart/style.scss
index fbf38244eee..e183ce70b0f 100644
--- a/assets/js/blocks/cart-checkout/mini-cart/style.scss
+++ b/assets/js/blocks/cart-checkout/mini-cart/style.scss
@@ -4,7 +4,7 @@
 	justify-content: flex-end;
 
 	&.is-transparent .wc-block-mini-cart__button {
-		background: transparent !important;
+		background-color: transparent !important;
 	}
 }