diff --git a/src/client/App.fs b/src/client/App.fs
index d2c2767..a40bec7 100644
--- a/src/client/App.fs
+++ b/src/client/App.fs
@@ -29,12 +29,30 @@ module Client =
         let Menu() =
             // We use hashed subpages, such as /#/charting. This way each page can be refreshed.
             [
-                "Home", MainTemplate.DashboardIcon().Doc(), "/#" + router.Link(Home)
-                "Charting", MainTemplate.DashboardIcon().Doc(), "/#" + router.Link(Charting)
-                "Forms", MainTemplate.DashboardIcon().Doc(), "/#" + router.Link(Forms)
+                Home, "Dashboard", MainTemplate.TablesIcon().Doc(), "/#" + router.Link(Home)
+                Charting, "Charting", MainTemplate.ChartsIcon().Doc(), "/#" + router.Link(Charting)
+                Forms, "Forms", MainTemplate.FormsIcon().Doc(), "/#" + router.Link(Forms)
             ]
-            |> List.map (fun (title, icon, targetUrl) ->
+            |> List.map (fun (ep, title, icon, targetUrl) ->
                 MainTemplate.MenuItem()
+                    .ActiveIndicator(
+                        currentPage.View.Map(fun cp ->
+                            // If the current page is active, add an active menu item indicator
+                            if ep = cp then
+                                Templates.MainTemplate.MenuItemActiveIndicator().Doc()
+                            else
+                                Doc.Empty
+                        ) |> Doc.EmbedView
+                    )
+                    .ExtraCssClasses(
+                        currentPage.View.Map(fun cp ->
+                            // If the current page is active, raise the font color
+                            if ep = cp then
+                                "text-gray-800 dark:text-gray-100"
+                            else
+                                ""
+                        )
+                    )
                     .Title(title)
                     .Icon(icon)
                     .TargetUrl(targetUrl)
@@ -44,9 +62,9 @@ module Client =
         let MobileMenu() =
             // We use hashed subpages, such as /#/charting. This way each page can be refreshed.
             [
-                "Home", MainTemplate.DashboardIcon().Doc(), "/#" + router.Link(Home)
-                "Charting", MainTemplate.DashboardIcon().Doc(), "/#" + router.Link(Charting)
-                "Forms", MainTemplate.DashboardIcon().Doc(), "/#" + router.Link(Forms)
+                "Dashboard", MainTemplate.TablesIcon().Doc(), "/#" + router.Link(Home)
+                "Charting", MainTemplate.ChartsIcon().Doc(), "/#" + router.Link(Charting)
+                "Forms", MainTemplate.FormsIcon().Doc(), "/#" + router.Link(Forms)
             ]
             |> List.map (fun (title, icon, targetUrl) ->
                 MainTemplate.MobileMenuItem()
diff --git a/src/client/Grid.fs b/src/client/Grid.fs
index b8e8d61..91e1a63 100644
--- a/src/client/Grid.fs
+++ b/src/client/Grid.fs
@@ -25,7 +25,6 @@ module Grid =
                         // Render each into a table row
                         txns
                         |> Array.map (fun txn ->
-                            printfn "%A" txn
                             Templates.MainTemplate.ClientTransactionRow()
                                 .AvatarUrl(txn.To.AvatarUrl)
                                 .Name($"{txn.To.FirstName} {txn.To.LastName}")
diff --git a/src/client/index.html b/src/client/index.html
index 03f3e7e..55e9ef2 100644
--- a/src/client/index.html
+++ b/src/client/index.html
@@ -30,7 +30,8 @@
                 </a>
                 <ul class="mt-6" ws-hole="Menu">
                     <li ws-template="MenuItem" class="relative px-6 py-3">
-                        <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
+                        <div ws-replace="ActiveIndicator"></div>
+                        <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200 ${ExtraCssClasses}"
                            href="${TargetUrl}">
                             <svg ws-replace="Icon" ws-template="DashboardIcon" class="w-5 h-5"
                                  aria-hidden="true"
@@ -46,11 +47,11 @@
                         </a>
                     </li>
                     <li class="relative px-6 py-3">
-                        <span class="absolute inset-y-0 left-0 w-1 bg-purple-600 rounded-tr-lg rounded-br-lg"
+                        <span ws-template="MenuItemActiveIndicator" class="absolute inset-y-0 left-0 w-1 bg-purple-600 rounded-tr-lg rounded-br-lg"
                               aria-hidden="true"></span>
                         <a class="inline-flex items-center w-full text-sm font-semibold text-gray-800 transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200 dark:text-gray-100"
                            href="forms.html">
-                            <svg class="w-5 h-5"
+                            <svg ws-template="FormsIcon" class="w-5 h-5"
                                  aria-hidden="true"
                                  fill="none"
                                  stroke-linecap="round"
@@ -66,7 +67,7 @@
                     <li class="relative px-6 py-3">
                         <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
                            href="cards.html">
-                            <svg class="w-5 h-5"
+                            <svg ws-template="CardsIcon" class="w-5 h-5"
                                  aria-hidden="true"
                                  fill="none"
                                  stroke-linecap="round"
@@ -82,7 +83,7 @@
                     <li class="relative px-6 py-3">
                         <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
                            href="charts.html">
-                            <svg class="w-5 h-5"
+                            <svg ws-template="ChartsIcon" class="w-5 h-5"
                                  aria-hidden="true"
                                  fill="none"
                                  stroke-linecap="round"
@@ -99,7 +100,7 @@
                     <li class="relative px-6 py-3">
                         <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
                            href="buttons.html">
-                            <svg class="w-5 h-5"
+                            <svg ws-template="ButtonsIcon" class="w-5 h-5"
                                  aria-hidden="true"
                                  fill="none"
                                  stroke-linecap="round"
@@ -115,7 +116,7 @@
                     <li class="relative px-6 py-3">
                         <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
                            href="modals.html">
-                            <svg class="w-5 h-5"
+                            <svg ws-template="ModalsIcon" class="w-5 h-5"
                                  aria-hidden="true"
                                  fill="none"
                                  stroke-linecap="round"
@@ -131,7 +132,7 @@
                     <li class="relative px-6 py-3">
                         <a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
                            href="tables.html">
-                            <svg class="w-5 h-5"
+                            <svg ws-template="TablesIcon" class="w-5 h-5"
                                  aria-hidden="true"
                                  fill="none"
                                  stroke-linecap="round"
diff --git a/src/shared/Shared.fs b/src/shared/Shared.fs
index 4bce2ca..38a7c60 100644
--- a/src/shared/Shared.fs
+++ b/src/shared/Shared.fs
@@ -2,7 +2,6 @@
 
 open WebSharper
 
-[<JavaScript>]
 module DTO =
     type Client =
         {