diff --git a/packages/js/product-editor/changelog/fix-toggle-misspelling-in-class-names b/packages/js/product-editor/changelog/fix-toggle-misspelling-in-class-names
new file mode 100644
index 00000000000..cdef9bd7270
--- /dev/null
+++ b/packages/js/product-editor/changelog/fix-toggle-misspelling-in-class-names
@@ -0,0 +1,4 @@
+Significance: minor
+Type: tweak
+
+Fix toogle typo in class names
diff --git a/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/downloads-menu.tsx b/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/downloads-menu.tsx
index 3bf0ff3f2d5..e90a3921cf7 100644
--- a/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/downloads-menu.tsx
+++ b/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/downloads-menu.tsx
@@ -33,7 +33,7 @@ export function DownloadsMenu( {
 					icon={ isOpen ? chevronUp : chevronDown }
 					variant="secondary"
 					onClick={ onToggle }
-					className="woocommerce-downloads-menu__toogle"
+					className="woocommerce-downloads-menu__toggle"
 				>
 					<span>{ __( 'Add new', 'woocommerce' ) }</span>
 				</Button>
diff --git a/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/style.scss b/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/style.scss
index fe56bd2c248..0cec19b4642 100644
--- a/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/style.scss
+++ b/packages/js/product-editor/src/blocks/product-fields/downloads/downloads-menu/style.scss
@@ -1,5 +1,5 @@
 .woocommerce-downloads-menu {
-	&__toogle {
+	&__toggle {
 		flex-direction: row-reverse;
 
 		> span {
diff --git a/packages/js/product-editor/src/components/variations-table/styles.scss b/packages/js/product-editor/src/components/variations-table/styles.scss
index 9e78670f16a..a58f35e4c3f 100644
--- a/packages/js/product-editor/src/components/variations-table/styles.scss
+++ b/packages/js/product-editor/src/components/variations-table/styles.scss
@@ -162,7 +162,7 @@
 		gap: $gap-smaller;
 		margin-right: $gap-smallest;
 
-		.variations-actions-menu__toogle:disabled {
+		.variations-actions-menu__toggle:disabled {
 			cursor: not-allowed;
 		}
 
diff --git a/packages/js/product-editor/src/components/variations-table/variation-actions-menus/multiple-update-menu.tsx b/packages/js/product-editor/src/components/variations-table/variation-actions-menus/multiple-update-menu.tsx
index 8c5f6e74fa7..12c3eb0b0a4 100644
--- a/packages/js/product-editor/src/components/variations-table/variation-actions-menus/multiple-update-menu.tsx
+++ b/packages/js/product-editor/src/components/variations-table/variation-actions-menus/multiple-update-menu.tsx
@@ -35,7 +35,7 @@ export function MultipleUpdateMenu( {
 					icon={ isOpen ? chevronUp : chevronDown }
 					variant="secondary"
 					onClick={ onToggle }
-					className="variations-actions-menu__toogle"
+					className="variations-actions-menu__toggle"
 				>
 					<span>{ __( 'Quick update', 'woocommerce' ) }</span>
 				</Button>
diff --git a/packages/js/product-editor/src/components/variations-table/variation-actions-menus/styles.scss b/packages/js/product-editor/src/components/variations-table/variation-actions-menus/styles.scss
index 99143614edc..7956e681575 100644
--- a/packages/js/product-editor/src/components/variations-table/variation-actions-menus/styles.scss
+++ b/packages/js/product-editor/src/components/variations-table/variation-actions-menus/styles.scss
@@ -1,5 +1,5 @@
 .variations-actions-menu {
-	&__toogle {
+	&__toggle {
 		flex-direction: row-reverse;
 
 		> span {