diff --git a/change/@fluentui-react-tree-0b6932ba-9e9f-4bc9-9d59-4d8152ff0cfe.json b/change/@fluentui-react-tree-0b6932ba-9e9f-4bc9-9d59-4d8152ff0cfe.json
new file mode 100644
index 00000000000000..aab00dedfa227b
--- /dev/null
+++ b/change/@fluentui-react-tree-0b6932ba-9e9f-4bc9-9d59-4d8152ff0cfe.json
@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "bugfix: Tree, vertical spacing of branches and children is inconsistent",
+  "packageName": "@fluentui/react-tree",
+  "email": "petrduda@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-tree/src/components/FlatTree/useFlatTreeStyles.styles.ts b/packages/react-components/react-tree/src/components/FlatTree/useFlatTreeStyles.styles.ts
index c096d5bf3ed814..2079cc20cf75af 100644
--- a/packages/react-components/react-tree/src/components/FlatTree/useFlatTreeStyles.styles.ts
+++ b/packages/react-components/react-tree/src/components/FlatTree/useFlatTreeStyles.styles.ts
@@ -1,4 +1,4 @@
-import { makeStyles, mergeClasses, shorthands } from '@griffel/react';
+import { makeStyles, mergeClasses } from '@griffel/react';
 import type { SlotClassNames } from '@fluentui/react-utilities';
 import { tokens } from '@fluentui/react-theme';
 import { FlatTreeSlots, FlatTreeState } from './FlatTree.types';
@@ -13,20 +13,10 @@ const useStyles = makeStyles({
     flexDirection: 'column',
     rowGap: tokens.spacingVerticalXXS,
   },
-  subtree: {
-    ...shorthands.flex(1, 1, '100%'),
-    ...shorthands.gridArea('subtree'),
-  },
 });
 
 export const useFlatTreeStyles_unstable = (state: FlatTreeState): FlatTreeState => {
   const styles = useStyles();
-  const isSubTree = state.level > 0;
-  state.root.className = mergeClasses(
-    flatTreeClassNames.root,
-    styles.root,
-    isSubTree && styles.subtree,
-    state.root.className,
-  );
+  state.root.className = mergeClasses(flatTreeClassNames.root, styles.root, state.root.className);
   return state;
 };
diff --git a/packages/react-components/react-tree/src/components/Tree/useTreeStyles.styles.ts b/packages/react-components/react-tree/src/components/Tree/useTreeStyles.styles.ts
index e4383543191797..780b2b2f50c8af 100644
--- a/packages/react-components/react-tree/src/components/Tree/useTreeStyles.styles.ts
+++ b/packages/react-components/react-tree/src/components/Tree/useTreeStyles.styles.ts
@@ -1,4 +1,4 @@
-import { makeStyles, mergeClasses, shorthands } from '@griffel/react';
+import { makeStyles, mergeClasses } from '@griffel/react';
 import type { TreeSlots, TreeState } from './Tree.types';
 import type { SlotClassNames } from '@fluentui/react-utilities';
 import { tokens } from '@fluentui/react-theme';
@@ -14,14 +14,14 @@ const useStyles = makeStyles({
     rowGap: tokens.spacingVerticalXXS,
   },
   subtree: {
-    ...shorthands.flex(1, 1, '100%'),
-    ...shorthands.gridArea('subtree'),
+    paddingTop: tokens.spacingVerticalXXS,
   },
 });
 
 export const useTreeStyles_unstable = (state: TreeState): TreeState => {
   const styles = useStyles();
-  const isSubTree = state.level > 0;
+  const isSubTree = state.level > 1;
+
   state.root.className = mergeClasses(
     treeClassNames.root,
     styles.root,