diff --git a/apps/frontend/apps/lyra-app/components/nav/NavLink.vue b/apps/frontend/apps/lyra-app/components/nav/NavLink.vue
index b9a9b8cb..6c02bd79 100644
--- a/apps/frontend/apps/lyra-app/components/nav/NavLink.vue
+++ b/apps/frontend/apps/lyra-app/components/nav/NavLink.vue
@@ -21,7 +21,7 @@ const props = withDefaults(
     isCollapsed?: boolean;
   }>(),
   {
-    icon: 'lucide:file',
+    icon: 'ph:dot-thin',
     title: '',
     to: '',
     label: '',
@@ -39,7 +39,9 @@ const { hasPermission } = usePermissionCheck(props.to);
 
 const isActiveLink = computed(() => {
   if (!props.to) return false;
-  return route.path === props.to || route.path.startsWith(props.to);
+  if (route.path === props.to) return true;
+  if (props.to === '/') return route.path === '/';
+  return route.path.startsWith(props.to);
 });
 
 const computedClasses = computed(() => {
diff --git a/apps/frontend/apps/lyra-app/components/nav/links-list.ts b/apps/frontend/apps/lyra-app/components/nav/links-list.ts
index 4e6eab0c..def89ac8 100644
--- a/apps/frontend/apps/lyra-app/components/nav/links-list.ts
+++ b/apps/frontend/apps/lyra-app/components/nav/links-list.ts
@@ -10,14 +10,14 @@ const navigationLinks: LinkProp[] = [
     title: 'Dashboard',
     to: '/',
     icon: 'lucide:layout-dashboard',
-    variant: 'default',
+    variant: 'ghost',
   },
   {
     id: generateId('Start Writing'),
     title: 'Start Writing',
-    to: '/',
+    to: '/posts',
     icon: 'lucide:layout-dashboard',
-    variant: 'default',
+    variant: 'ghost',
   },
   {
     id: generateId('Posts'),