diff --git a/components/src/asciidoc/TableOfContents.tsx b/components/src/asciidoc/TableOfContents.tsx
index 30516c8e..d0b729a3 100644
--- a/components/src/asciidoc/TableOfContents.tsx
+++ b/components/src/asciidoc/TableOfContents.tsx
@@ -6,11 +6,13 @@
  * Copyright Oxide Computer Company
  */
 import { DirectionRightIcon } from '@/icons/react'
-import type { DocumentSection } from '@oxide/react-asciidoc'
+import { type DocumentSection, parse } from '@oxide/react-asciidoc'
 import * as Accordion from '@radix-ui/react-accordion'
 import cn from 'classnames'
 import { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react'
 
+import { stripAnchors } from './Section'
+
 export function useIntersectionObserver(
   elements: Element[],
   callback: IntersectionObserverCallback,
@@ -283,7 +285,7 @@ export const DesktopOutline = ({
               paddingLeft: `${0.5 + item.level * 0.5}rem`,
             }}
           >
-            <span dangerouslySetInnerHTML={{ __html: item.title }} />
+            {parse(stripAnchors(item.title))}
           </a>
         </li>
         {item.sections && renderToc(item.sections)}
@@ -328,7 +330,7 @@ export const SmallScreenOutline = ({
               paddingLeft: `${0.5 + item.level * 0.5}rem`,
             }}
           >
-            <span dangerouslySetInnerHTML={{ __html: item.title }} />
+            {parse(stripAnchors(item.title))}
           </a>
         </li>
         {item.sections && renderToc(item.sections)}
diff --git a/components/src/assets/asciidoc.css b/components/src/assets/asciidoc.css
index 4fe9c5c1..d2a42b30 100644
--- a/components/src/assets/asciidoc.css
+++ b/components/src/assets/asciidoc.css
@@ -141,7 +141,8 @@
       @apply mb-2 mt-8 text-sans-lg text-raise;
     }
 
-    .anchor {
+    .anchor,
+    .sectionanchor {
       position: absolute;
       margin-top: calc(var(--header-height) * -1 - 20px);
       visibility: hidden;