diff --git a/change/@fluentui-babel-make-styles-0f380f7f-bdcf-47cc-90fe-13178669ca54.json b/change/@fluentui-babel-make-styles-0f380f7f-bdcf-47cc-90fe-13178669ca54.json
new file mode 100644
index 0000000000000..29afe8555da9f
--- /dev/null
+++ b/change/@fluentui-babel-make-styles-0f380f7f-bdcf-47cc-90fe-13178669ca54.json
@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update fixtures",
+  "packageName": "@fluentui/babel-make-styles",
+  "email": "olfedias@microsoft.com",
+  "dependentChangeType": "none"
+}
diff --git a/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/code.ts b/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/code.ts
index 6480c9c0dd425..666897c05ad0a 100644
--- a/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/code.ts
+++ b/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/code.ts
@@ -5,7 +5,7 @@ export var makeButtonTokens = (theme: Theme) => {
   return {
     primary: {
       hovered: {
-        background: theme.colorBrandBackgroundHover,
+        backgroundColor: theme.colorBrandBackgroundHover,
       },
     },
   };
@@ -17,7 +17,7 @@ export var useStyles = makeStyles({
     var buttonTokens = makeButtonTokens(theme);
     return {
       color: 'red',
-      background: (_a = buttonTokens.primary.hovered) === null || _a === void 0 ? void 0 : _a.background,
+      backgroundColor: (_a = buttonTokens.primary.hovered) === null || _a === void 0 ? void 0 : _a.backgroundColor,
     };
   },
 });
diff --git a/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/output.ts b/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/output.ts
index 48515c6f60ff1..19afcf9cf1a19 100644
--- a/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/output.ts
+++ b/packages/babel-make-styles/__fixtures__/compiled-optional-chaining/output.ts
@@ -4,7 +4,7 @@ export var makeButtonTokens = (theme: Theme) => {
   return {
     primary: {
       hovered: {
-        background: theme.colorBrandBackgroundHover,
+        backgroundColor: theme.colorBrandBackgroundHover,
       },
     },
   };
@@ -13,10 +13,10 @@ export var useStyles = __styles(
   {
     rootPrimary: {
       sj55zd: 'fe3e8s9',
-      ayd6f0: 'fgc1sir',
+      De3pzq: 'fb65zs0',
     },
   },
   {
-    d: ['.fe3e8s9{color:red;}', '.fgc1sir{background:var(--colorBrandBackgroundHover);}'],
+    d: ['.fe3e8s9{color:red;}', '.fb65zs0{background-color:var(--colorBrandBackgroundHover);}'],
   },
 );
diff --git a/packages/babel-make-styles/__fixtures__/object-computed-keys/code.ts b/packages/babel-make-styles/__fixtures__/object-computed-keys/code.ts
index 9805a07aa79d9..5386ba0182fcf 100644
--- a/packages/babel-make-styles/__fixtures__/object-computed-keys/code.ts
+++ b/packages/babel-make-styles/__fixtures__/object-computed-keys/code.ts
@@ -3,6 +3,6 @@ import { makeStyles } from '@fluentui/react-make-styles';
 const rootSlot = 'root';
 
 export const useStyles = makeStyles({
-  [rootSlot]: { color: 'red', padding: '4px' },
-  [rootSlot + 'primary']: { background: 'green', marginLeft: '4px' },
+  [rootSlot]: { color: 'red', paddingLeft: '4px' },
+  [rootSlot + 'primary']: { backgroundColor: 'green', marginLeft: '4px' },
 });
diff --git a/packages/babel-make-styles/__fixtures__/object-computed-keys/output.ts b/packages/babel-make-styles/__fixtures__/object-computed-keys/output.ts
index d594d22fdbe72..44b6ad205328f 100644
--- a/packages/babel-make-styles/__fixtures__/object-computed-keys/output.ts
+++ b/packages/babel-make-styles/__fixtures__/object-computed-keys/output.ts
@@ -4,24 +4,19 @@ export const useStyles = __styles(
   {
     root: {
       sj55zd: 'fe3e8s9',
-      z8tnut: 'f10ra9hq',
-      z189sj: ['f8wuabp', 'fycuoez'],
-      Byoj8tv: 'f1y2xyjm',
       uwmqm3: ['fycuoez', 'f8wuabp'],
     },
     rootprimary: {
-      ayd6f0: 'f65sxns',
+      De3pzq: 'fcnqdeg',
       Frg6f3: ['fjf1xye', 'f8zmjen'],
     },
   },
   {
     d: [
       '.fe3e8s9{color:red;}',
-      '.f10ra9hq{padding-top:4px;}',
-      '.f8wuabp{padding-right:4px;}',
       '.fycuoez{padding-left:4px;}',
-      '.f1y2xyjm{padding-bottom:4px;}',
-      '.f65sxns{background:green;}',
+      '.f8wuabp{padding-right:4px;}',
+      '.fcnqdeg{background-color:green;}',
       '.fjf1xye{margin-left:4px;}',
       '.f8zmjen{margin-right:4px;}',
     ],
diff --git a/packages/babel-make-styles/__fixtures__/object-mixins/mixins.ts b/packages/babel-make-styles/__fixtures__/object-mixins/mixins.ts
index 221f2133818a5..08d31e6815a90 100644
--- a/packages/babel-make-styles/__fixtures__/object-mixins/mixins.ts
+++ b/packages/babel-make-styles/__fixtures__/object-mixins/mixins.ts
@@ -8,7 +8,7 @@ export const flexStyles: MakeStyles = {
 
 export const gridStyles = (gridGap: string): MakeStyles => ({
   display: 'grid',
-  gridGap,
+  gridRowGap: gridGap,
 });
 
 export const typography: Record<'text' | 'header', MakeStylesStyleRule<Theme>> = {
diff --git a/packages/babel-make-styles/__fixtures__/object-mixins/output.ts b/packages/babel-make-styles/__fixtures__/object-mixins/output.ts
index 7a55d1d031e9f..3b1db46d44d1c 100644
--- a/packages/babel-make-styles/__fixtures__/object-mixins/output.ts
+++ b/packages/babel-make-styles/__fixtures__/object-mixins/output.ts
@@ -19,7 +19,7 @@ export const useStyles = __styles(
     },
     image: {
       mc9l5x: 'f13qh94s',
-      w08cwm: 'fz44487',
+      a6qtfi: 'f85kjgz',
       sj55zd: 'fka9v86',
     },
   },
@@ -31,7 +31,7 @@ export const useStyles = __styles(
       '.f16wzh4i{font-weight:bold;}',
       '.fe3e8s9{color:red;}',
       '.f13qh94s{display:grid;}',
-      '.fz44487{grid-gap:10px;}',
+      '.f85kjgz{grid-row-gap:10px;}',
       '.fka9v86{color:green;}',
     ],
   },
diff --git a/packages/babel-make-styles/__fixtures__/object-variables/code.ts b/packages/babel-make-styles/__fixtures__/object-variables/code.ts
index 46d850c0f8737..9913f56054996 100644
--- a/packages/babel-make-styles/__fixtures__/object-variables/code.ts
+++ b/packages/babel-make-styles/__fixtures__/object-variables/code.ts
@@ -4,6 +4,6 @@ import { colorGreen, theme } from './vars';
 const colorRed = 'red';
 
 export const useStyles = makeStyles({
-  root: { color: colorRed, padding: '4px' },
-  icon: { color: theme.black, background: colorGreen, marginLeft: '4px' },
+  root: { color: colorRed, paddingLeft: '4px' },
+  icon: { color: theme.black, backgroundColor: colorGreen, marginLeft: '4px' },
 });
diff --git a/packages/babel-make-styles/__fixtures__/object-variables/output.ts b/packages/babel-make-styles/__fixtures__/object-variables/output.ts
index 06f0e839bc1c7..f259e22dc11da 100644
--- a/packages/babel-make-styles/__fixtures__/object-variables/output.ts
+++ b/packages/babel-make-styles/__fixtures__/object-variables/output.ts
@@ -5,26 +5,21 @@ export const useStyles = __styles(
   {
     root: {
       sj55zd: 'fe3e8s9',
-      z8tnut: 'f10ra9hq',
-      z189sj: ['f8wuabp', 'fycuoez'],
-      Byoj8tv: 'f1y2xyjm',
       uwmqm3: ['fycuoez', 'f8wuabp'],
     },
     icon: {
       sj55zd: 'fusgiwz',
-      ayd6f0: 'f65sxns',
+      De3pzq: 'fcnqdeg',
       Frg6f3: ['fjf1xye', 'f8zmjen'],
     },
   },
   {
     d: [
       '.fe3e8s9{color:red;}',
-      '.f10ra9hq{padding-top:4px;}',
-      '.f8wuabp{padding-right:4px;}',
       '.fycuoez{padding-left:4px;}',
-      '.f1y2xyjm{padding-bottom:4px;}',
+      '.f8wuabp{padding-right:4px;}',
       '.fusgiwz{color:#000;}',
-      '.f65sxns{background:green;}',
+      '.fcnqdeg{background-color:green;}',
       '.fjf1xye{margin-left:4px;}',
       '.f8zmjen{margin-right:4px;}',
     ],
diff --git a/packages/babel-make-styles/__fixtures__/object/code.ts b/packages/babel-make-styles/__fixtures__/object/code.ts
index 712e49993ddc9..9a9a73969b661 100644
--- a/packages/babel-make-styles/__fixtures__/object/code.ts
+++ b/packages/babel-make-styles/__fixtures__/object/code.ts
@@ -1,6 +1,6 @@
 import { makeStyles } from '@fluentui/react-make-styles';
 
 export const useStyles = makeStyles({
-  root: { color: 'red', padding: '4px' },
-  icon: { background: 'green', marginLeft: '4px' },
+  root: { color: 'red', paddingLeft: '4px' },
+  icon: { backgroundColor: 'green', marginLeft: '4px' },
 });
diff --git a/packages/babel-make-styles/__fixtures__/object/output.ts b/packages/babel-make-styles/__fixtures__/object/output.ts
index 181c906430e6a..a62d10711e64c 100644
--- a/packages/babel-make-styles/__fixtures__/object/output.ts
+++ b/packages/babel-make-styles/__fixtures__/object/output.ts
@@ -3,24 +3,19 @@ export const useStyles = __styles(
   {
     root: {
       sj55zd: 'fe3e8s9',
-      z8tnut: 'f10ra9hq',
-      z189sj: ['f8wuabp', 'fycuoez'],
-      Byoj8tv: 'f1y2xyjm',
       uwmqm3: ['fycuoez', 'f8wuabp'],
     },
     icon: {
-      ayd6f0: 'f65sxns',
+      De3pzq: 'fcnqdeg',
       Frg6f3: ['fjf1xye', 'f8zmjen'],
     },
   },
   {
     d: [
       '.fe3e8s9{color:red;}',
-      '.f10ra9hq{padding-top:4px;}',
-      '.f8wuabp{padding-right:4px;}',
       '.fycuoez{padding-left:4px;}',
-      '.f1y2xyjm{padding-bottom:4px;}',
-      '.f65sxns{background:green;}',
+      '.f8wuabp{padding-right:4px;}',
+      '.fcnqdeg{background-color:green;}',
       '.fjf1xye{margin-left:4px;}',
       '.f8zmjen{margin-right:4px;}',
     ],