diff --git a/change/@fluentui-react-tag-picker-f788c84a-933e-4291-9111-2a6187517663.json b/change/@fluentui-react-tag-picker-f788c84a-933e-4291-9111-2a6187517663.json
new file mode 100644
index 00000000000000..3f3abb7239db9f
--- /dev/null
+++ b/change/@fluentui-react-tag-picker-f788c84a-933e-4291-9111-2a6187517663.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "bugfix: secondaryContent not displaying properly",
+  "packageName": "@fluentui/react-tag-picker",
+  "email": "bernardo.sunderhus@gmail.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/__snapshots__/TagPickerOption.test.tsx.snap b/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/__snapshots__/TagPickerOption.test.tsx.snap
index 907a79f7e94918..2b7ec9972e024e 100644
--- a/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/__snapshots__/TagPickerOption.test.tsx.snap
+++ b/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/__snapshots__/TagPickerOption.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`TagPickerOption renders a default state 1`] = `
 <div>
   <div
     aria-selected="false"
-    class="fui-TagPickerOption fui-Option"
+    class="fui-Option fui-TagPickerOption"
     id="fluent-option8"
     role="option"
   >
diff --git a/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/useTagPickerOptionStyles.styles.ts b/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/useTagPickerOptionStyles.styles.ts
index d9ae8758f70399..c8b27a0f42eb16 100644
--- a/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/useTagPickerOptionStyles.styles.ts
+++ b/packages/react-components/react-tag-picker/library/src/components/TagPickerOption/useTagPickerOptionStyles.styles.ts
@@ -2,6 +2,7 @@ import { makeStyles, mergeClasses } from '@griffel/react';
 import type { SlotClassNames } from '@fluentui/react-utilities';
 import type { TagPickerOptionSlots, TagPickerOptionState } from './TagPickerOption.types';
 import { useOptionStyles_unstable } from '@fluentui/react-combobox';
+import { typographyStyles } from '@fluentui/react-theme';
 
 export const tagPickerOptionClassNames: SlotClassNames<TagPickerOptionSlots> = {
   root: 'fui-TagPickerOption',
@@ -22,6 +23,7 @@ const useStyles = makeStyles({
   secondaryContent: {
     gridColumnStart: 2,
     gridRowStart: 2,
+    ...typographyStyles.caption1,
   },
 
   media: {
@@ -35,6 +37,9 @@ const useStyles = makeStyles({
 export const useTagPickerOptionStyles_unstable = (state: TagPickerOptionState): TagPickerOptionState => {
   'use no memo';
 
+  const styles = useStyles();
+
+  state.root.className = mergeClasses(tagPickerOptionClassNames.root, styles.root, state.root.className);
   useOptionStyles_unstable({
     ...state,
     active: false,
@@ -43,9 +48,6 @@ export const useTagPickerOptionStyles_unstable = (state: TagPickerOptionState):
     checkIcon: undefined,
     selected: false,
   });
-  const styles = useStyles();
-
-  state.root.className = mergeClasses(tagPickerOptionClassNames.root, styles.root, state.root.className);
   if (state.media) {
     state.media.className = mergeClasses(tagPickerOptionClassNames.media, styles.media, state.media.className);
   }