diff --git a/site/components/Layout.tsx b/site/components/Layout.tsx
index 3c95e1ad..507f45ba 100644
--- a/site/components/Layout.tsx
+++ b/site/components/Layout.tsx
@@ -103,7 +103,7 @@ export default function Layout({
       {tableOfContents.length > 0 && siteConfig.tableOfContents && (
         <div className="hidden xl:fixed xl:right-0 xl:top-[4.5rem] xl:block xl:w-1/5 xl:h-[calc(100vh-4.5rem)] xl:flex-none xl:overflow-y-auto xl:py-16 xl:pr-6 xl:mb-16">
           <nav aria-labelledby="on-this-page-title" className="w-56">
-            <h2 className="font-display text-md font-medium text-slate-900 dark:text-white">
+            <h2 className="font-display text-md font-medium text-primary dark:text-primary-dark">
               On this page
             </h2>
             <ol className="mt-4 space-y-3 text-sm">
@@ -114,7 +114,7 @@ export default function Layout({
                       href={`#${section.id}`}
                       className={
                         isActive(section)
-                          ? 'text-sky-500'
+                          ? 'text-secondary'
                           : 'font-normal text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-300'
                       }
                     >