diff --git a/packages/core/src/app/order/OrderSummaryItem.spec.tsx b/packages/core/src/app/order/OrderSummaryItem.spec.tsx
index fd863411be..3c9955c57c 100644
--- a/packages/core/src/app/order/OrderSummaryItem.spec.tsx
+++ b/packages/core/src/app/order/OrderSummaryItem.spec.tsx
@@ -18,7 +18,8 @@ describe('OrderSummaryItems', () => {
                     productOptions={[
                         {
                             testId: 'test-id',
-                            content: <span />,
+                            optionLabel: 'Color',
+                            optionValue: 'Red',
                         },
                     ]}
                     quantity={2}
diff --git a/packages/core/src/app/order/OrderSummaryItem.tsx b/packages/core/src/app/order/OrderSummaryItem.tsx
index aaffa3879c..8ea7da4d60 100644
--- a/packages/core/src/app/order/OrderSummaryItem.tsx
+++ b/packages/core/src/app/order/OrderSummaryItem.tsx
@@ -17,7 +17,9 @@ export interface OrderSummaryItemProps {
 
 export interface OrderSummaryItemOption {
     testId: string;
-    content: ReactNode;
+    content?: ReactNode;
+    optionLabel?: ReactNode;
+    optionValue?: ReactNode;
 }
 
 const OrderSummaryItem: FunctionComponent<OrderSummaryItemProps> = ({
@@ -37,7 +39,8 @@ const OrderSummaryItem: FunctionComponent<OrderSummaryItemProps> = ({
                 className="product-title optimizedCheckout-contentPrimary"
                 data-test="cart-item-product-title"
             >
-                {`${quantity} x ${name}`}
+                <span className="product-item-quantity">{quantity}</span>
+                <span className="product-item-name">{name}</span>
             </h4>
             {productOptions && productOptions.length > 0 && (
                 <ul
@@ -46,7 +49,8 @@ const OrderSummaryItem: FunctionComponent<OrderSummaryItemProps> = ({
                 >
                     {productOptions.map((option, index) => (
                         <li className="product-option" data-test={option.testId} key={index}>
-                            {option.content}
+                            <span className="product-option-label">{option.optionLabel}</span>
+                            <span className="product-option-value">{option.optionValue}</span>
                         </li>
                     ))}
                 </ul>
diff --git a/packages/core/src/app/order/__snapshots__/OrderSummaryItem.spec.tsx.snap b/packages/core/src/app/order/__snapshots__/OrderSummaryItem.spec.tsx.snap
index 288e020cf2..7f14324591 100644
--- a/packages/core/src/app/order/__snapshots__/OrderSummaryItem.spec.tsx.snap
+++ b/packages/core/src/app/order/__snapshots__/OrderSummaryItem.spec.tsx.snap
@@ -17,7 +17,16 @@ exports[`OrderSummaryItems when amount and amountAfterDiscount are different ren
       className="product-title optimizedCheckout-contentPrimary"
       data-test="cart-item-product-title"
     >
-      2 x Product
+      <span
+        className="product-item-quantity"
+      >
+        2
+      </span>
+      <span
+        className="product-item-name"
+      >
+        Product
+      </span>
     </h4>
     <ul
       className="product-options optimizedCheckout-contentSecondary"
@@ -28,7 +37,16 @@ exports[`OrderSummaryItems when amount and amountAfterDiscount are different ren
         data-test="test-id"
         key="0"
       >
-        <span />
+        <span
+          className="product-option-label"
+        >
+          Color
+        </span>
+        <span
+          className="product-option-value"
+        >
+          Red
+        </span>
       </li>
     </ul>
   </div>
diff --git a/packages/core/src/app/order/__snapshots__/OrderSummaryItems.spec.tsx.snap b/packages/core/src/app/order/__snapshots__/OrderSummaryItems.spec.tsx.snap
index 82affd5f34..582f090a58 100644
--- a/packages/core/src/app/order/__snapshots__/OrderSummaryItems.spec.tsx.snap
+++ b/packages/core/src/app/order/__snapshots__/OrderSummaryItems.spec.tsx.snap
@@ -24,7 +24,8 @@ exports[`OrderSummaryItems when it has 4 line items or less renders product list
       productOptions={
         Array [
           Object {
-            "content": "n v",
+            "optionLabel": "n",
+            "optionValue": "v",
             "testId": "cart-item-product-option",
           },
         ]
@@ -70,7 +71,8 @@ exports[`OrderSummaryItems when it has 4 line items or less renders product list
       productOptions={
         Array [
           Object {
-            "content": "m l",
+            "optionLabel": "m",
+            "optionValue": "l",
             "testId": "cart-item-product-option",
           },
           Object {
diff --git a/packages/core/src/app/order/mapFromDigital.tsx b/packages/core/src/app/order/mapFromDigital.tsx
index 295265791c..2c281333eb 100644
--- a/packages/core/src/app/order/mapFromDigital.tsx
+++ b/packages/core/src/app/order/mapFromDigital.tsx
@@ -17,7 +17,8 @@ function mapFromDigital(item: DigitalItem): OrderSummaryItemProps {
         productOptions: [
             ...(item.options || []).map((option) => ({
                 testId: 'cart-item-product-option',
-                content: `${option.name} ${option.value}`,
+                optionLabel: `${option.name}`,
+                optionValue: `${option.value}`,
             })),
             getDigitalItemDescription(item),
         ],
diff --git a/packages/core/src/app/order/mapFromPhysical.tsx b/packages/core/src/app/order/mapFromPhysical.tsx
index ad2d0e8f5a..56bd69efa8 100644
--- a/packages/core/src/app/order/mapFromPhysical.tsx
+++ b/packages/core/src/app/order/mapFromPhysical.tsx
@@ -14,7 +14,8 @@ function mapFromPhysical(item: PhysicalItem): OrderSummaryItemProps {
         description: item.giftWrapping ? item.giftWrapping.name : undefined,
         productOptions: (item.options || []).map((option) => ({
             testId: 'cart-item-product-option',
-            content: `${option.name} ${option.value}`,
+            optionLabel: `${option.name}`,
+            optionValue: `${option.value}`,
         })),
     };
 }
diff --git a/packages/core/src/scss/components/checkout/productList/_productList.scss b/packages/core/src/scss/components/checkout/productList/_productList.scss
index d9e237ae7c..54e89e90a1 100644
--- a/packages/core/src/scss/components/checkout/productList/_productList.scss
+++ b/packages/core/src/scss/components/checkout/productList/_productList.scss
@@ -61,12 +61,24 @@
 
 .product-title {
     margin-bottom: spacing("eighth");
+
+    .product-item-quantity::after {
+        content: ' x ';
+    }
 }
 
 .product-options {
     color: color("greys");
     font-size: fontSize("tiny");
     margin: 0;
+
+    .product-option-label {
+        font-weight: fontWeight("bold");
+
+        &::after {
+            content: ' ';
+        }
+    }
 }
 
 .product-description {