diff --git a/change/@fluentui-react-tags-preview-94eb29aa-e1eb-4bc6-a747-23edc4f50642.json b/change/@fluentui-react-tags-preview-94eb29aa-e1eb-4bc6-a747-23edc4f50642.json
new file mode 100644
index 00000000000000..8de4bb6b3d6b13
--- /dev/null
+++ b/change/@fluentui-react-tags-preview-94eb29aa-e1eb-4bc6-a747-23edc4f50642.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: tag with secondary text has no top border under windows high contrast",
+  "packageName": "@fluentui/react-tags-preview",
+  "email": "yuanboxue@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-tags-preview/src/components/InteractionTagPrimary/useInteractionTagPrimaryStyles.styles.ts b/packages/react-components/react-tags-preview/src/components/InteractionTagPrimary/useInteractionTagPrimaryStyles.styles.ts
index c3fcefdd60a6dc..d072e495c7ee61 100644
--- a/packages/react-components/react-tags-preview/src/components/InteractionTagPrimary/useInteractionTagPrimaryStyles.styles.ts
+++ b/packages/react-components/react-tags-preview/src/components/InteractionTagPrimary/useInteractionTagPrimaryStyles.styles.ts
@@ -9,6 +9,7 @@ import {
   useMediaStyles,
   usePrimaryTextStyles,
   useSecondaryTextStyles,
+  useTagWithSecondaryTextContrastStyles,
 } from '../Tag/useTagStyles.styles';
 
 export const interactionTagPrimaryClassNames: SlotClassNames<InteractionTagPrimarySlots> = {
@@ -189,6 +190,8 @@ export const useInteractionTagPrimaryStyles_unstable = (
   const primaryTextStyles = usePrimaryTextStyles();
   const secondaryTextStyles = useSecondaryTextStyles();
 
+  const tagWithSecondaryTextContrastStyles = useTagWithSecondaryTextContrastStyles();
+
   const { shape, size, appearance } = state;
 
   state.root.className = mergeClasses(
@@ -203,6 +206,8 @@ export const useInteractionTagPrimaryStyles_unstable = (
     state.hasSecondaryAction && rootWithSecondaryActionStyles.base,
     state.hasSecondaryAction && rootWithSecondaryActionStyles[size],
 
+    state.secondaryText && tagWithSecondaryTextContrastStyles[shape],
+
     state.root.className,
   );
 
diff --git a/packages/react-components/react-tags-preview/src/components/Tag/useTagStyles.styles.ts b/packages/react-components/react-tags-preview/src/components/Tag/useTagStyles.styles.ts
index f1549943637100..06338e12c6d2e0 100644
--- a/packages/react-components/react-tags-preview/src/components/Tag/useTagStyles.styles.ts
+++ b/packages/react-components/react-tags-preview/src/components/Tag/useTagStyles.styles.ts
@@ -258,6 +258,43 @@ export const usePrimaryTextStyles = makeStyles({
   },
 });
 
+/**
+ * Styles for root slot under windows high contrast mode when Tag is with secondary text.
+ * Tag's primary text has negative margin that covers the border. Pseudo element is used to draw the border.
+ */
+export const useTagWithSecondaryTextContrastStyles = makeStyles({
+  rounded: {
+    '@media (forced-colors: active)': {
+      position: 'relative',
+      '::before': {
+        content: '""',
+        ...shorthands.border(tokens.strokeWidthThin, 'solid'),
+        position: 'absolute',
+        top: '-1px',
+        left: '-1px',
+        right: '-1px',
+        bottom: '-1px',
+        ...shorthands.borderRadius(tokens.borderRadiusMedium),
+      },
+    },
+  },
+  circular: {
+    '@media (forced-colors: active)': {
+      position: 'relative',
+      '::before': {
+        content: '""',
+        ...shorthands.border(tokens.strokeWidthThin, 'solid'),
+        position: 'absolute',
+        top: '-1px',
+        left: '-1px',
+        right: '-1px',
+        bottom: '-1px',
+        ...shorthands.borderRadius(tokens.borderRadiusCircular),
+      },
+    },
+  },
+});
+
 export const useSecondaryTextStyles = makeStyles({
   base: {
     ...shorthands.gridArea('secondary'),
@@ -283,6 +320,8 @@ export const useTagStyles_unstable = (state: TagState): TagState => {
   const primaryTextStyles = usePrimaryTextStyles();
   const secondaryTextStyles = useSecondaryTextStyles();
 
+  const tagWithSecondaryTextContrastStyles = useTagWithSecondaryTextContrastStyles();
+
   const { shape, size, appearance } = state;
 
   state.root.className = mergeClasses(
@@ -297,6 +336,8 @@ export const useTagStyles_unstable = (state: TagState): TagState => {
     !state.media && !state.icon && rootWithoutMediaStyles[size],
     !state.dismissIcon && rootWithoutDismissStyles[size],
 
+    state.secondaryText && tagWithSecondaryTextContrastStyles[shape],
+
     state.root.className,
   );