diff --git a/app/pages/index.vue b/app/pages/index.vue
index 8079d94..35d7026 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -15,7 +15,8 @@ const { data } = useModrinthFetch<statistics>("/statistics");
 
 <template>
   <Teleport to="#navBody">
-    <NuxtLink href="/charts">
+    <NuxtLink href="/charts" id="chartsLink">
+      <Icon name="ph:chart-line" size="35"/>
       Charts
     </NuxtLink>
   </Teleport>
@@ -75,6 +76,19 @@ const { data } = useModrinthFetch<statistics>("/statistics");
 </template>
 
 <style scoped>
+#chartsLink{
+  text-decoration: none;
+  font-size: xx-large;
+  font-weight: bold;
+
+  display: flex;
+  gap: 10px;
+  align-items: center;
+
+  &:hover{
+    color: var(--primary-500);
+  }
+}
 #page {
   flex: 1;
   background: linear-gradient(180deg, var(--surface-100) 0%, var(--surface-mixed-100) 150%);