diff --git a/packages/sdk-components-react-radix/src/__generated__/accordion.stories.tsx b/packages/sdk-components-react-radix/src/__generated__/accordion.stories.tsx
index 5142ecd7665d..76af24657d89 100644
--- a/packages/sdk-components-react-radix/src/__generated__/accordion.stories.tsx
+++ b/packages/sdk-components-react-radix/src/__generated__/accordion.stories.tsx
@@ -262,7 +262,7 @@ const Story = {
     --accordion-trigger-icon-transform: 180deg
   }
   .w-icon-container {
-    rotate: --accordion-trigger-icon-transform;
+    rotate: var(--accordion-trigger-icon-transform);
     height: 1rem;
     width: 1rem;
     flex-shrink: 0;
@@ -311,7 +311,7 @@ const Story = {
     --accordion-trigger-icon-transform: 180deg
   }
   .w-icon-container-1 {
-    rotate: --accordion-trigger-icon-transform;
+    rotate: var(--accordion-trigger-icon-transform);
     height: 1rem;
     width: 1rem;
     flex-shrink: 0;
@@ -360,7 +360,7 @@ const Story = {
     --accordion-trigger-icon-transform: 180deg
   }
   .w-icon-container-2 {
-    rotate: --accordion-trigger-icon-transform;
+    rotate: var(--accordion-trigger-icon-transform);
     height: 1rem;
     width: 1rem;
     flex-shrink: 0;
diff --git a/packages/sdk-components-react-radix/src/accordion.template.tsx b/packages/sdk-components-react-radix/src/accordion.template.tsx
index e51c8ac23c04..8bb7c8240323 100644
--- a/packages/sdk-components-react-radix/src/accordion.template.tsx
+++ b/packages/sdk-components-react-radix/src/accordion.template.tsx
@@ -55,7 +55,7 @@ const createAccordionItem = (triggerText: string, contentText: string) => {
             ws:label="Icon Container"
             // h-4 w-4 shrink-0 transition-transform duration-200
             ws:style={css`
-              rotate: --accordion-trigger-icon-transform;
+              rotate: var(--accordion-trigger-icon-transform);
               height: ${height[4]};
               width: ${width[4]};
               flex-shrink: 0;