diff --git a/src/App.tsx b/src/App.tsx
index 4c67bdb..c3e2591 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -9,7 +9,12 @@ export function App() {
       <header>
         <h1>React State Management</h1>
         <nav>
-          <Link to="/">Introduction</Link>
+          <NavLink
+            to="/"
+            end
+            className={({ isActive }) => (isActive ? 'isActive' : '')}>
+            Introduction
+          </NavLink>
           {strategies.map(({ name }) => (
             <NavLink
               key={name}
diff --git a/src/index.html b/src/index.html
index 71a05f1..5e36d33 100644
--- a/src/index.html
+++ b/src/index.html
@@ -4,6 +4,12 @@
     <meta charset="utf-8" />
     <title>React State Management</title>
     <link rel="stylesheet" href="npm:simpledotcss/simple.min.css" />
+    <style>
+      a.isActive {
+        background-color: var(--accent);
+        color: var(--bg) !important;
+      }
+    </style>
   </head>
   <body>
     <div id="app"></div>
