diff --git a/.changeset/lemon-phones-rescue.md b/.changeset/lemon-phones-rescue.md
new file mode 100644
index 00000000000..c96d4529290
--- /dev/null
+++ b/.changeset/lemon-phones-rescue.md
@@ -0,0 +1,12 @@
+---
+"@kaizen/components": minor
+---
+
+Update FilterMultiSelect ListBoxSection to avoid duplicate reading of sectionName as the accessible title.
+
+- Update sectionName to be optional if sectionHeader is provided
+  - This will solve the issue of sectionName and sectionHeader being read twice when they are the same
+- Minor style change to ensure hide bullet lists as filtering 
+- Minor style changes to allow for default text styles for section headings with just text
+- Add conditional check to render the sectionName only if provided
+- Add tests to validate type accessible names are constructed as expected
\ No newline at end of file
diff --git a/packages/components/src/FilterMultiSelect/_docs/FilterMultiSelect.stories.tsx b/packages/components/src/FilterMultiSelect/_docs/FilterMultiSelect.stories.tsx
index c9c557e0482..77f32d06efe 100644
--- a/packages/components/src/FilterMultiSelect/_docs/FilterMultiSelect.stories.tsx
+++ b/packages/components/src/FilterMultiSelect/_docs/FilterMultiSelect.stories.tsx
@@ -150,6 +150,7 @@ export const WithSections: StoryFn<typeof FilterMultiSelect> = () => {
         selectedKeys={selectedKeys}
         items={mockItems}
         label="Engineer"
+        isOpen={IS_CHROMATIC || undefined}
         trigger={(): JSX.Element => (
           <FilterMultiSelect.TriggerButton
             selectedOptionLabels={getSelectedOptionLabels(
@@ -222,13 +223,14 @@ export const WithSections: StoryFn<typeof FilterMultiSelect> = () => {
       </FilterMultiSelect>
       <div style={{ marginTop: 4 }}>
         <Paragraph variant="body">Items: </Paragraph>
-        <Highlight className="json">
-          {JSON.stringify(mockItems, null, "\t")}
-        </Highlight>
+        <Highlight>{JSON.stringify(mockItems, null, "\t")}</Highlight>
       </div>
     </>
   )
 }
+WithSections.parameters = {
+  chromatic: { disable: false },
+}
 
 export const TruncatedLabels: StoryFn<typeof FilterMultiSelect> = () => {
   const [selectedKeys, setSelectedKeys] = useState<Selection>(
@@ -606,7 +608,7 @@ export const Async: StoryFn<typeof FilterMultiSelect> = args => {
 }
 Async.decorators = [withQueryProvider]
 
-export const WithSectionHeader: StoryFn<typeof FilterMultiSelect> = () => {
+export const WithSectionHeaders: StoryFn<typeof FilterMultiSelect> = () => {
   const [selectedKeys, setSelectedKeys] = useState<Selection>(
     new Set(["id-fe"])
   )
@@ -620,6 +622,7 @@ export const WithSectionHeader: StoryFn<typeof FilterMultiSelect> = () => {
         selectedKeys={selectedKeys}
         items={mockItems}
         label="Engineer"
+        isOpen={IS_CHROMATIC || undefined}
         trigger={(): JSX.Element => (
           <FilterMultiSelect.TriggerButton
             selectedOptionLabels={getSelectedOptionLabels(
@@ -639,63 +642,176 @@ export const WithSectionHeader: StoryFn<typeof FilterMultiSelect> = () => {
                 unselectedItems,
                 disabledItems,
                 hasNoItems,
-              }): JSX.Element => (
-                <>
-                  {hasNoItems && (
-                    <FilterMultiSelect.NoResults>
-                      No results found.
-                    </FilterMultiSelect.NoResults>
-                  )}
-                  <FilterMultiSelect.ListBoxSection
-                    items={selectedItems}
-                    sectionName="Selected items"
-                  >
-                    {(item): JSX.Element => (
-                      <FilterMultiSelect.Option key={item.key} item={item} />
+              }): JSX.Element =>
+                hasNoItems ? (
+                  <FilterMultiSelect.NoResults>
+                    No results found.
+                  </FilterMultiSelect.NoResults>
+                ) : (
+                  <>
+                    {selectedItems.length > 0 && (
+                      <FilterMultiSelect.ListBoxSection
+                        items={selectedItems}
+                        sectionHeader="Selected items"
+                      >
+                        {(item): JSX.Element => (
+                          <FilterMultiSelect.Option
+                            key={item.key}
+                            item={item}
+                          />
+                        )}
+                      </FilterMultiSelect.ListBoxSection>
                     )}
-                  </FilterMultiSelect.ListBoxSection>
 
-                  {unselectedItems.length > 0 && selectedItems.length > 0 && (
-                    <FilterMultiSelect.SectionDivider />
-                  )}
-
-                  <FilterMultiSelect.ListBoxSection
-                    items={unselectedItems}
-                    sectionName="Unselected items"
-                  >
-                    {(item): JSX.Element => (
-                      <FilterMultiSelect.Option key={item.key} item={item} />
+                    {unselectedItems.length > 0 && (
+                      <FilterMultiSelect.ListBoxSection
+                        items={unselectedItems}
+                        sectionHeader="Unselected items"
+                      >
+                        {(item): JSX.Element => (
+                          <FilterMultiSelect.Option
+                            key={item.key}
+                            item={item}
+                          />
+                        )}
+                      </FilterMultiSelect.ListBoxSection>
                     )}
-                  </FilterMultiSelect.ListBoxSection>
 
-                  {disabledItems.length > 0 &&
-                    (selectedItems.length > 0 ||
-                      unselectedItems.length > 0) && (
-                      <FilterMultiSelect.SectionDivider />
-                    )}
-                  <FilterMultiSelect.ListBoxSection
-                    items={disabledItems}
-                    sectionName="Disabled items"
-                    sectionHeader={
-                      <InlineNotification
-                        type="cautionary"
-                        persistent
-                        noBottomMargin
-                        headingProps={{
-                          tag: "span",
-                          variant: "heading-5",
-                          children: "Confidentiality protection",
-                        }}
+                    {disabledItems.length > 0 && (
+                      <FilterMultiSelect.ListBoxSection
+                        items={disabledItems}
+                        sectionHeader="Disabled items"
                       >
-                        Results for these filters are hidden to protect
-                        identities of individuals and small groups
-                      </InlineNotification>
-                    }
-                  >
-                    {(item): JSX.Element => (
-                      <FilterMultiSelect.Option key={item.key} item={item} />
+                        {(item): JSX.Element => (
+                          <FilterMultiSelect.Option
+                            key={item.key}
+                            item={item}
+                          />
+                        )}
+                      </FilterMultiSelect.ListBoxSection>
                     )}
-                  </FilterMultiSelect.ListBoxSection>
+                  </>
+                )
+              }
+            </FilterMultiSelect.ListBox>
+            <FilterMultiSelect.MenuFooter>
+              <FilterMultiSelect.SelectAllButton />
+              <FilterMultiSelect.ClearButton />
+            </FilterMultiSelect.MenuFooter>
+          </>
+        )}
+      </FilterMultiSelect>
+    </>
+  )
+}
+WithSectionHeaders.parameters = {
+  chromatic: { disable: false },
+}
+
+export const WithSectionNotification: StoryFn<
+  typeof FilterMultiSelect
+> = () => {
+  const [selectedKeys, setSelectedKeys] = useState<Selection>(
+    new Set(["id-fe"])
+  )
+
+  const handleSelectionChange = (keys: Selection): void => setSelectedKeys(keys)
+
+  return (
+    <>
+      <FilterMultiSelect
+        onSelectionChange={handleSelectionChange}
+        selectedKeys={selectedKeys}
+        items={mockItems}
+        label="Engineer"
+        isOpen={IS_CHROMATIC || undefined}
+        trigger={(): JSX.Element => (
+          <FilterMultiSelect.TriggerButton
+            selectedOptionLabels={getSelectedOptionLabels(
+              selectedKeys,
+              mockItems
+            )}
+            label="Engineer"
+          />
+        )}
+      >
+        {(): JSX.Element => (
+          <>
+            <FilterMultiSelect.SearchInput />
+            <FilterMultiSelect.ListBox>
+              {({
+                selectedItems,
+                unselectedItems,
+                disabledItems,
+                hasNoItems,
+              }): JSX.Element => (
+                <>
+                  {hasNoItems ? (
+                    <FilterMultiSelect.NoResults>
+                      No results found.
+                    </FilterMultiSelect.NoResults>
+                  ) : (
+                    <>
+                      {selectedItems.length > 0 && (
+                        <FilterMultiSelect.ListBoxSection
+                          items={selectedItems}
+                          sectionHeader="Selected items"
+                        >
+                          {(item): JSX.Element => (
+                            <FilterMultiSelect.Option
+                              key={item.key}
+                              item={item}
+                            />
+                          )}
+                        </FilterMultiSelect.ListBoxSection>
+                      )}
+
+                      {unselectedItems.length > 0 && (
+                        <FilterMultiSelect.ListBoxSection
+                          items={unselectedItems}
+                          sectionHeader="Unselected items"
+                        >
+                          {(item): JSX.Element => (
+                            <FilterMultiSelect.Option
+                              key={item.key}
+                              item={item}
+                            />
+                          )}
+                        </FilterMultiSelect.ListBoxSection>
+                      )}
+
+                      {disabledItems.length > 0 && (
+                        <FilterMultiSelect.ListBoxSection
+                          items={disabledItems}
+                          sectionHeader={
+                            <>
+                              <span className="mb-6">Disabled items</span>
+                              <InlineNotification
+                                type="cautionary"
+                                persistent
+                                noBottomMargin
+                                headingProps={{
+                                  tag: "span",
+                                  variant: "heading-5",
+                                  children: "Confidentiality protection",
+                                }}
+                              >
+                                Results for these filters are hidden to protect
+                                identities of individuals and small groups
+                              </InlineNotification>
+                            </>
+                          }
+                        >
+                          {(item): JSX.Element => (
+                            <FilterMultiSelect.Option
+                              key={item.key}
+                              item={item}
+                            />
+                          )}
+                        </FilterMultiSelect.ListBoxSection>
+                      )}
+                    </>
+                  )}
                 </>
               )}
             </FilterMultiSelect.ListBox>
@@ -706,12 +822,9 @@ export const WithSectionHeader: StoryFn<typeof FilterMultiSelect> = () => {
           </>
         )}
       </FilterMultiSelect>
-      <div style={{ marginTop: 4 }}>
-        <Paragraph variant="body">Items: </Paragraph>
-        <Highlight className="json">
-          {JSON.stringify(mockItems, null, "\t")}
-        </Highlight>
-      </div>
     </>
   )
 }
+WithSectionNotification.parameters = {
+  chromatic: { disable: false },
+}
diff --git a/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.module.scss b/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.module.scss
index e7277b3d9ea..eba898e545b 100644
--- a/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.module.scss
+++ b/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.module.scss
@@ -16,3 +16,8 @@
 .hidden {
   display: none;
 }
+
+// this is a div but remove styles briefly flickering to a bullet list as the sections are removed
+.noResultsWrapper {
+  list-style: none;
+}
diff --git a/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.tsx b/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.tsx
index b9e120b17ea..60e2351f4a0 100644
--- a/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.tsx
+++ b/packages/components/src/FilterMultiSelect/subcomponents/ListBox/ListBox.tsx
@@ -76,7 +76,7 @@ export const ListBox = ({ children }: ListBoxProps): JSX.Element => {
   if (hasNoItems) {
     return (
       <>
-        <div>{children(itemsState)}</div>
+        <div className={styles.noResultsWrapper}>{children(itemsState)}</div>
         {/* This ul with the ref needs to exist otherwise it fatals */}
         <ul ref={listRef} className={styles.hidden} />
       </>
diff --git a/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.module.scss b/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.module.scss
index 77abe226818..f8dd21dc932 100644
--- a/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.module.scss
+++ b/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.module.scss
@@ -1,5 +1,18 @@
+@import "~@kaizen/design-tokens/sass/typography";
+@import "~@kaizen/design-tokens/sass/color";
+@import "~@kaizen/design-tokens/sass/spacing";
+
 .listBoxSection {
   display: grid;
   list-style: none;
   padding: 0;
 }
+
+.listBoxSectionHeader {
+  font-family: $typography-heading-6-font-family;
+  font-size: $typography-heading-6-font-size;
+  font-weight: $typography-heading-6-font-weight;
+  line-height: $typography-heading-6-line-height;
+  color: rgba($color-purple-800-rgb, 0.7);
+  margin: $spacing-6 0;
+}
diff --git a/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.spec.tsx b/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.spec.tsx
new file mode 100644
index 00000000000..1c3c92f5644
--- /dev/null
+++ b/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.spec.tsx
@@ -0,0 +1,50 @@
+import React from "react"
+import { render } from "@testing-library/react"
+import { ListBoxSection } from "./ListBoxSection"
+
+describe("<ListBoxSection />", () => {
+  describe("sectionName only", () => {
+    it("will only have aria-label", () => {
+      const { getByRole } = render(
+        <ListBoxSection sectionName="Test sectionName only" items={[]}>
+          {() => undefined}
+        </ListBoxSection>
+      )
+      const group = getByRole("group")
+      expect(group).toHaveAttribute("aria-label", "Test sectionName only")
+      expect(group).not.toHaveTextContent("Test sectionName only")
+    })
+  })
+
+  describe("sectionHeader only", () => {
+    it("will have sectionHeader content", () => {
+      const { getByRole } = render(
+        <ListBoxSection sectionHeader="Test sectionHeader only" items={[]}>
+          {() => undefined}
+        </ListBoxSection>
+      )
+      const group = getByRole("group", { name: "Test sectionHeader only" })
+      expect(group).toBeInTheDocument()
+      expect(group).toHaveTextContent("Test sectionHeader only")
+    })
+  })
+
+  describe("sectionHeader and sectionName", () => {
+    it("will have combined accessible name", () => {
+      const { getByRole } = render(
+        <ListBoxSection
+          sectionName="Hidden group name"
+          sectionHeader="sectionHeader name"
+          items={[]}
+        >
+          {() => undefined}
+        </ListBoxSection>
+      )
+      const group = getByRole("group", {
+        name: "Hidden group name. sectionHeader name",
+      })
+      expect(group).toBeInTheDocument()
+      expect(group).toHaveTextContent("Hidden group name. sectionHeader name")
+    })
+  })
+})
diff --git a/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx b/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx
index b4771db5472..3e14221bb83 100644
--- a/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx
+++ b/packages/components/src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx
@@ -3,41 +3,57 @@ import { v4 } from "uuid"
 import { VisuallyHidden } from "@kaizen/a11y"
 import { MultiSelectItem } from "../../types"
 import styles from "./ListBoxSection.module.scss"
-export interface ListBoxSectionProps {
-  items: MultiSelectItem[]
+
+type SectionNameProps = {
   /**
    * Becomes an aria-label on the section, informing
    * unsighted users
    */
   sectionName: string
-  /** If provided, will override the aria-label for this group */
-  sectionHeader?: ReactNode
-  children: (item: MultiSelectItem) => React.ReactNode
 }
 
+type SectionHeaderProps = {
+  /**
+   * Becomes an aria-label on the section, informing
+   * unsighted users
+   */
+  sectionName?: string
+  /**
+   * Can be used for a visual title of the ListBoxSection or to provide addition information in a React node.
+   * If this is the same title as sectionName, you should only pass in a sectionHeader to avoid duplicate descriptions.
+   */
+  sectionHeader: ReactNode
+}
+
+export type ListBoxSectionProps = {
+  items: MultiSelectItem[]
+  children: (item: MultiSelectItem) => React.ReactNode
+} & (SectionHeaderProps | SectionNameProps)
+
 export const ListBoxSection = ({
   items,
-  sectionName,
   children,
-  sectionHeader,
+  sectionName,
+  ...restProps
 }: ListBoxSectionProps): JSX.Element => {
   const [listSectionId] = useState<string>(v4())
+  const hasSectionHeader = "sectionHeader" in restProps
   return (
     <li role="presentation">
       <ul
         className={styles.listBoxSection}
-        aria-label={sectionName}
-        aria-labelledby={sectionHeader ? listSectionId : undefined}
+        aria-label={!hasSectionHeader ? sectionName : undefined}
+        aria-labelledby={hasSectionHeader ? listSectionId : undefined}
         role="group"
       >
-        {sectionHeader && (
+        {hasSectionHeader && (
           <li
             className={styles.listBoxSectionHeader}
             id={listSectionId}
             role="presentation"
           >
-            <VisuallyHidden>{sectionName}. </VisuallyHidden>
-            {sectionHeader}
+            {sectionName && <VisuallyHidden>{sectionName}. </VisuallyHidden>}
+            {restProps.sectionHeader}
           </li>
         )}
         {/*