diff --git a/package.json b/package.json
index a6d3f351..c6abd5dd 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,6 @@
     "localforage": "^1.9.0",
     "lodash": "^4.17.19",
     "lssm": "^1.1.2",
-    "lucide-vue-next": "^0.311.0",
     "nanoid": "^3.1.30",
     "pinia": "^2.0.29",
     "sortablejs": "^1.15.0",
@@ -40,6 +39,8 @@
     "vue-typed-virtual-list": "^1.0.10"
   },
   "devDependencies": {
+    "@iconify-json/lucide": "^1.1.181",
+    "@iconify-json/ph": "^1.1.12",
     "@tailwindcss/forms": "^0.5.3",
     "@tailwindcss/typography": "^0.5.9",
     "@types/js-cookie": "^3.0.6",
@@ -60,6 +61,7 @@
     "prettier-plugin-tailwindcss": "^0.2.8",
     "tailwindcss": "^3.3.2",
     "typescript": "^5.1.3",
+    "unplugin-icons": "^0.18.5",
     "vite": "^5.2.8",
     "vite-svg-loader": "^5.1.0",
     "vue-eslint-parser": "^9.3.1"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 7790c641..eae46ee6 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -68,9 +68,6 @@ dependencies:
   lssm:
     specifier: ^1.1.2
     version: 1.1.2
-  lucide-vue-next:
-    specifier: ^0.311.0
-    version: 0.311.0(vue@3.3.4)
   nanoid:
     specifier: ^3.1.30
     version: 3.3.6
@@ -97,6 +94,12 @@ dependencies:
     version: 1.0.10(vue@3.3.4)
 
 devDependencies:
+  '@iconify-json/lucide':
+    specifier: ^1.1.181
+    version: 1.1.181
+  '@iconify-json/ph':
+    specifier: ^1.1.12
+    version: 1.1.12
   '@tailwindcss/forms':
     specifier: ^0.5.3
     version: 0.5.3(tailwindcss@3.3.2)
@@ -157,6 +160,9 @@ devDependencies:
   typescript:
     specifier: ^5.1.3
     version: 5.1.3
+  unplugin-icons:
+    specifier: ^0.18.5
+    version: 0.18.5
   vite:
     specifier: ^5.2.8
     version: 5.2.8(@types/node@20.2.5)
@@ -179,17 +185,14 @@ packages:
     dependencies:
       execa: 5.1.1
       find-up: 5.0.0
-    dev: false
 
   /@antfu/install-pkg@0.3.2:
     resolution: {integrity: sha512-FFYqME8+UHlPnRlX/vn+8cTD4Wo/nG/lzRxpABs3XANBmdJdNImVz3QvjNAE/W3PSCNbG387FOz8o5WelnWOlg==}
     dependencies:
       execa: 8.0.1
-    dev: false
 
   /@antfu/utils@0.7.7:
     resolution: {integrity: sha512-gFPqTG7otEJ8uP6wrhDv6mqwGWYZKNvAcCq6u9hOj0c+IKCEsY4L1oC9trPq2SaWIzAfHvqfBDxF591JkMf+kg==}
-    dev: false
 
   /@babel/helper-string-parser@7.21.5:
     resolution: {integrity: sha512-5pTUx3hAJaZIdW99sJ6ZUUgWq/Y+Hja7TowEnLNMm1VivRgZQL3vpBY3qUACVsvw+yQU6+YgfBVmcbLaZtrA1w==}
@@ -559,9 +562,20 @@ packages:
       - supports-color
     dev: false
 
+  /@iconify-json/lucide@1.1.181:
+    resolution: {integrity: sha512-y00OPoPteIS5I9PeM+aEe+KXKJ+CC4pVosirhTKKeKVxWuVSu4mK/Q7gWiee2i1X4rznNxm/qGLIzImufbVaUg==}
+    dependencies:
+      '@iconify/types': 2.0.0
+    dev: true
+
+  /@iconify-json/ph@1.1.12:
+    resolution: {integrity: sha512-m+rXTW084YaQQHT+F8TxdkCoAh+i/5MWRoSuPmxCWPlxwMAaLT/QfyVsbEiV95HM5806U/jKpBV6F1b7Pmr3Vg==}
+    dependencies:
+      '@iconify/types': 2.0.0
+    dev: true
+
   /@iconify/types@2.0.0:
     resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
-    dev: false
 
   /@iconify/utils@2.1.22:
     resolution: {integrity: sha512-6UHVzTVXmvO8uS6xFF+L/QTSpTzA/JZxtgU+KYGFyDYMEObZ1bu/b5l+zNJjHy+0leWjHI+C0pXlzGvv3oXZMA==}
@@ -575,7 +589,6 @@ packages:
       mlly: 1.6.1
     transitivePeerDependencies:
       - supports-color
-    dev: false
 
   /@jridgewell/gen-mapping@0.3.3:
     resolution: {integrity: sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==}
@@ -1511,7 +1524,6 @@ packages:
     resolution: {integrity: sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==}
     engines: {node: '>=0.4.0'}
     hasBin: true
-    dev: false
 
   /acorn@8.8.2:
     resolution: {integrity: sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==}
@@ -1693,7 +1705,6 @@ packages:
       readdirp: 3.6.0
     optionalDependencies:
       fsevents: 2.3.3
-    dev: false
 
   /color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
@@ -2150,7 +2161,6 @@ packages:
       onetime: 5.1.2
       signal-exit: 3.0.7
       strip-final-newline: 2.0.0
-    dev: false
 
   /execa@8.0.1:
     resolution: {integrity: sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==}
@@ -2165,7 +2175,6 @@ packages:
       onetime: 6.0.0
       signal-exit: 4.1.0
       strip-final-newline: 3.0.0
-    dev: false
 
   /fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
@@ -2302,12 +2311,10 @@ packages:
   /get-stream@6.0.1:
     resolution: {integrity: sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==}
     engines: {node: '>=10'}
-    dev: false
 
   /get-stream@8.0.1:
     resolution: {integrity: sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==}
     engines: {node: '>=16'}
-    dev: false
 
   /glob-parent@5.1.2:
     resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
@@ -2408,12 +2415,10 @@ packages:
   /human-signals@2.1.0:
     resolution: {integrity: sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==}
     engines: {node: '>=10.17.0'}
-    dev: false
 
   /human-signals@5.0.0:
     resolution: {integrity: sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==}
     engines: {node: '>=16.17.0'}
-    dev: false
 
   /hybridly@0.7.3(@vueuse/core@10.1.2)(axios@1.6.8)(vite@5.2.8)(vue@3.3.4):
     resolution: {integrity: sha512-+YdscebUecp0yEUajaLjraBU7n0Ngd9M1wFyaTilgiCFerhPhoTX3AFJpy5YGPdVLWBqXAbaB9RG+rFayxfJwQ==}
@@ -2515,12 +2520,10 @@ packages:
   /is-stream@2.0.1:
     resolution: {integrity: sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==}
     engines: {node: '>=8'}
-    dev: false
 
   /is-stream@3.0.0:
     resolution: {integrity: sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
-    dev: false
 
   /is-what@4.1.13:
     resolution: {integrity: sha512-Aoe8pT24sWzyoO0S2PTDyutGp9l7qYHyFtzYlC8hMLshyqV/minljBANT4f2hiS5OxnWvcKMiA5io+VaLMJ1oA==}
@@ -2563,11 +2566,9 @@ packages:
 
   /jsonc-parser@3.2.0:
     resolution: {integrity: sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==}
-    dev: false
 
   /kolorist@1.8.0:
     resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==}
-    dev: false
 
   /ky@0.33.3:
     resolution: {integrity: sha512-CasD9OCEQSFIam2U8efFK81Yeg8vNMTBUqtMOHlrcWQHqUX3HeCl9Dr31u4toV7emlH8Mymk5+9p0lL6mKb/Xw==}
@@ -2624,7 +2625,6 @@ packages:
     dependencies:
       mlly: 1.6.1
       pkg-types: 1.0.3
-    dev: false
 
   /localforage@1.10.0:
     resolution: {integrity: sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg==}
@@ -2672,14 +2672,6 @@ packages:
     resolution: {integrity: sha512-0SP/ZTmkjWqZKlTQ0+L/8QMFTwU21LyLL4+a+VI0h4qm5mc5syZkER82VDBbKsmafL2QJhygimSb3zY6MRigEw==}
     dev: false
 
-  /lucide-vue-next@0.311.0(vue@3.3.4):
-    resolution: {integrity: sha512-AIPcj1Zvk9x2o7BhsVp5MUcJCejJ5ev0LQ5FFrXe3+ghiG1MZ/fHafxxwt2SRxl9CjYoYoURqLGz1hBvgXe8GA==}
-    peerDependencies:
-      vue: '>=3.0.1'
-    dependencies:
-      vue: 3.3.4
-    dev: false
-
   /magic-string@0.30.0:
     resolution: {integrity: sha512-LA+31JYDJLs82r2ScLrlz1GjSgu66ZV518eyWT+S8VhyQn/JL0u9MeBOvQMGYiPk1DBiSN9DDMOcXvigJZaViQ==}
     engines: {node: '>=12'}
@@ -2738,7 +2730,6 @@ packages:
 
   /merge-stream@2.0.0:
     resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
-    dev: false
 
   /merge2@1.4.1:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
@@ -2766,12 +2757,10 @@ packages:
   /mimic-fn@2.1.0:
     resolution: {integrity: sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==}
     engines: {node: '>=6'}
-    dev: false
 
   /mimic-fn@4.0.0:
     resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==}
     engines: {node: '>=12'}
-    dev: false
 
   /mini-svg-data-uri@1.4.4:
     resolution: {integrity: sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==}
@@ -2805,7 +2794,6 @@ packages:
       pathe: 1.1.2
       pkg-types: 1.0.3
       ufo: 1.5.3
-    dev: false
 
   /ms@2.1.2:
     resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
@@ -2854,14 +2842,12 @@ packages:
     engines: {node: '>=8'}
     dependencies:
       path-key: 3.1.1
-    dev: false
 
   /npm-run-path@5.3.0:
     resolution: {integrity: sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
     dependencies:
       path-key: 4.0.0
-    dev: false
 
   /nprogress@0.2.0:
     resolution: {integrity: sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==}
@@ -2898,14 +2884,12 @@ packages:
     engines: {node: '>=6'}
     dependencies:
       mimic-fn: 2.1.0
-    dev: false
 
   /onetime@6.0.0:
     resolution: {integrity: sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==}
     engines: {node: '>=12'}
     dependencies:
       mimic-fn: 4.0.0
-    dev: false
 
   /optionator@0.9.1:
     resolution: {integrity: sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==}
@@ -2958,7 +2942,6 @@ packages:
   /path-key@4.0.0:
     resolution: {integrity: sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==}
     engines: {node: '>=12'}
-    dev: false
 
   /path-parse@1.0.7:
     resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
@@ -2970,11 +2953,9 @@ packages:
 
   /pathe@1.1.1:
     resolution: {integrity: sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==}
-    dev: false
 
   /pathe@1.1.2:
     resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
-    dev: false
 
   /picocolors@1.0.0:
     resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
@@ -3017,7 +2998,6 @@ packages:
       jsonc-parser: 3.2.0
       mlly: 1.6.1
       pathe: 1.1.1
-    dev: false
 
   /postcss-import@15.1.0(postcss@8.4.24):
     resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
@@ -3469,12 +3449,10 @@ packages:
 
   /signal-exit@3.0.7:
     resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
-    dev: false
 
   /signal-exit@4.1.0:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
-    dev: false
 
   /slash@3.0.0:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
@@ -3513,12 +3491,10 @@ packages:
   /strip-final-newline@2.0.0:
     resolution: {integrity: sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==}
     engines: {node: '>=6'}
-    dev: false
 
   /strip-final-newline@3.0.0:
     resolution: {integrity: sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==}
     engines: {node: '>=12'}
-    dev: false
 
   /strip-json-comments@3.1.1:
     resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
@@ -3703,7 +3679,6 @@ packages:
 
   /ufo@1.5.3:
     resolution: {integrity: sha512-Y7HYmWaFwPUmkoQCUIAYpKqkOf+SbVj/2fJJZ4RJMCfZp0rTGwRbzQD+HghfnhKOjL9E01okqz+ncJskGYfBNw==}
-    dev: false
 
   /unhead@1.1.27:
     resolution: {integrity: sha512-KnE4xeV/mZLxnXG1VAp1nsaO2vzMq9Ch5uN4Y2SJAG4fXLEBi/A8evr3Vd81c+oAwQZjDXKFW60HDCJCkwo/Cw==}
@@ -3788,7 +3763,6 @@ packages:
       unplugin: 1.10.1
     transitivePeerDependencies:
       - supports-color
-    dev: false
 
   /unplugin-vue-components@0.26.0(vue@3.3.4):
     resolution: {integrity: sha512-s7IdPDlnOvPamjunVxw8kNgKNK8A5KM1YpK5j/p97jEKTjlPNrA0nZBiSfAKKlK1gWZuyWXlKL5dk3EDw874LQ==}
@@ -3827,7 +3801,6 @@ packages:
       chokidar: 3.6.0
       webpack-sources: 3.2.3
       webpack-virtual-modules: 0.6.1
-    dev: false
 
   /update-browserslist-db@1.0.11(browserslist@4.21.7):
     resolution: {integrity: sha512-dCwEFf0/oT85M1fHBg4F0jtLwJrutGoHSQXCh7u4o2t1drG+c0a9Flnqww6XUKSfQMPpJBRjU8d4RXB09qtvaA==}
@@ -3976,11 +3949,9 @@ packages:
   /webpack-sources@3.2.3:
     resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
     engines: {node: '>=10.13.0'}
-    dev: false
 
   /webpack-virtual-modules@0.6.1:
     resolution: {integrity: sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg==}
-    dev: false
 
   /which@2.0.2:
     resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
diff --git a/resources/components/Galileo.vue b/resources/components/Galileo.vue
index 283b6734..eba72267 100644
--- a/resources/components/Galileo.vue
+++ b/resources/components/Galileo.vue
@@ -1,7 +1,6 @@
 <script lang="ts" setup>
 import { useStarsFilterStore } from '@/store/useStarsFilterStore'
 import { isFocusedElementEditable } from '@/utils'
-import { MagnifyingGlassIcon } from '@heroicons/vue/24/outline'
 import { onKeyStroke } from '@vueuse/core'
 import { computed, ref } from 'vue'
 
@@ -41,7 +40,7 @@ onKeyStroke('/', e => {
         aria-keyshortcuts="/"
       />
 
-      <MagnifyingGlassIcon
+      <i-lucide-search
         class="pointer-events-none absolute left-2 h-5 w-5 text-gray-300 transition-colors peer-focus:text-gray-400 dark:text-gray-400"
         aria-hidden="true"
       />
diff --git a/resources/components/UserMenu.vue b/resources/components/UserMenu.vue
index 4fdb9730..cd2c4966 100644
--- a/resources/components/UserMenu.vue
+++ b/resources/components/UserMenu.vue
@@ -33,15 +33,15 @@ const userStore = useUserStore()
         <img
           :src="userStore.user?.avatar ?? undefined"
           :alt="userStore.user?.username"
-          class="image-rendering-crisp h-10 w-10 rounded-md"
+          class="image-rendering-crisp h-8 w-8 rounded-md"
         />
 
         <span class="ml-2 hidden text-sm font-semibold sm:inline-block">{{ userStore.user?.username }}</span>
 
-        <ChevronDownIcon
+        <i-lucide-chevron-down
           class="mt-0.5 ml-1 h-4 w-4 flex-shrink-0"
           :class="{ 'rotate-180': open }"
-          aria-hidden="true"
+          role="presentation"
         />
       </MenuButton>
     </div>
@@ -55,7 +55,7 @@ const userStore = useUserStore()
       leave-to-class="transform scale-95 opacity-0"
     >
       <MenuItems
-        class="absolute right-2 z-20 mt-2 w-56 origin-top-right divide-y divide-gray-100 rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:right-0 dark:bg-gray-800 dark:divide-gray-700 dark:border dark:border-gray-700"
+        class="absolute right-2 z-20 mt-0.5 w-56 origin-top-right divide-y divide-gray-100 rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:right-0 dark:bg-gray-800 dark:divide-gray-700 dark:border dark:border-gray-700 top-full"
       >
         <div class="py-1">
           <MenuItem v-slot="{ active }">
@@ -64,14 +64,18 @@ const userStore = useUserStore()
               class="group flex w-full items-center px-4 py-2 text-sm"
               :class="[
                 active
-                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-300'
-                  : 'text-gray-700 dark:text-gray-400',
+                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-200'
+                  : 'text-gray-700 dark:text-gray-300',
               ]"
               @click="emit('showSettings')"
             >
               <CogIcon
-                class="mr-3 h-5 w-5 text-gray-400 group-hover:text-gray-500 dark:text-gray-600 dark:group-hover:text-gray-300"
-                aria-hidden="true"
+                class="mr-3 h-5 w-5 group-hover:text-gray-500 dark:group-hover:text-gray-200 text-gray-400"
+                :class="{
+                  'dark:text-gray-200': active,
+                  'dark:text-gray-500 ': !active,
+                }"
+                role="presentation"
               />
 
               <span>Settings</span>
@@ -86,13 +90,17 @@ const userStore = useUserStore()
               class="group flex items-center px-4 py-2 text-sm"
               :class="[
                 active
-                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-300'
-                  : 'text-gray-700 dark:text-gray-400',
+                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-200'
+                  : 'text-gray-700 dark:text-gray-300',
               ]"
             >
               <UserGroupIcon
-                class="mr-3 h-5 w-5 text-gray-400 group-hover:text-gray-500 dark:text-gray-600 dark:group-hover:text-gray-300"
-                aria-hidden="true"
+                class="mr-3 h-5 w-5 group-hover:text-gray-500 dark:group-hover:text-gray-200 text-gray-400"
+                :class="{
+                  'dark:text-gray-200': active,
+                  'dark:text-gray-500 ': !active,
+                }"
+                role="presentation"
               />
 
               <span>Become a sponsor</span>
@@ -109,13 +117,17 @@ const userStore = useUserStore()
               class="group flex items-center px-4 py-2 text-sm"
               :class="[
                 active
-                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-300'
-                  : 'text-gray-700 dark:text-gray-400',
+                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-200'
+                  : 'text-gray-700 dark:text-gray-300',
               ]"
             >
               <GitHubLogoIcon
-                class="mr-3 h-5 w-5 text-gray-400 group-hover:text-gray-500 dark:text-gray-600 dark:group-hover:text-gray-300"
-                aria-hidden="true"
+                class="mr-3 h-5 w-5 group-hover:text-gray-500 dark:group-hover:text-gray-200 text-gray-400"
+                :class="{
+                  'dark:text-gray-200': active,
+                  'dark:text-gray-500 ': !active,
+                }"
+                role="presentation"
               />
 
               <span>View on GitHub</span>
@@ -130,13 +142,17 @@ const userStore = useUserStore()
               class="group flex items-center px-4 py-2 text-sm"
               :class="[
                 active
-                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-300'
-                  : 'text-gray-700 dark:text-gray-400',
+                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-200'
+                  : 'text-gray-700 dark:text-gray-300',
               ]"
             >
               <ChatBubbleLeftRightIcon
-                class="mr-3 h-5 w-5 text-gray-400 group-hover:text-gray-500 dark:text-gray-600 dark:group-hover:text-gray-300"
-                aria-hidden="true"
+                class="mr-3 h-5 w-5 group-hover:text-gray-500 dark:group-hover:text-gray-200 text-gray-400"
+                :class="{
+                  'dark:text-gray-200': active,
+                  'dark:text-gray-500 ': !active,
+                }"
+                role="presentation"
               />
 
               <span>Discussions</span>
@@ -151,13 +167,17 @@ const userStore = useUserStore()
               class="group flex items-center px-4 py-2 text-sm"
               :class="[
                 active
-                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-300'
-                  : 'text-gray-700 dark:text-gray-400',
+                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-200'
+                  : 'text-gray-700 dark:text-gray-300',
               ]"
             >
               <ExclamationCircleIcon
-                class="mr-3 h-5 w-5 text-gray-400 group-hover:text-gray-500 dark:text-gray-600 dark:group-hover:text-gray-300"
-                aria-hidden="true"
+                class="mr-3 h-5 w-5 group-hover:text-gray-500 dark:group-hover:text-gray-200 text-gray-400"
+                :class="{
+                  'dark:text-gray-200': active,
+                  'dark:text-gray-500 ': !active,
+                }"
+                role="presentation"
               />
 
               <span>File an issue</span>
@@ -172,13 +192,17 @@ const userStore = useUserStore()
               class="group flex items-center px-4 py-2 text-sm"
               :class="[
                 active
-                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-300'
-                  : 'text-gray-700 dark:text-gray-400',
+                  ? 'bg-gray-100 text-gray-900 dark:bg-gray-700 dark:text-gray-200'
+                  : 'text-gray-700 dark:text-gray-300',
               ]"
             >
               <ArrowRightStartOnRectangleIcon
-                class="mr-3 h-5 w-5 text-gray-400 group-hover:text-gray-500 dark:text-gray-600 dark:group-hover:text-gray-300"
-                aria-hidden="true"
+                class="mr-3 h-5 w-5 group-hover:text-gray-500 dark:group-hover:text-gray-200 text-gray-400"
+                :class="{
+                  'dark:text-gray-200': active,
+                  'dark:text-gray-500 ': !active,
+                }"
+                role="presentation"
               />
 
               <span>Sign out</span>
diff --git a/resources/components/shared/core/ActionDialog.vue b/resources/components/shared/core/ActionDialog.vue
index 17917933..79d52fe9 100644
--- a/resources/components/shared/core/ActionDialog.vue
+++ b/resources/components/shared/core/ActionDialog.vue
@@ -15,7 +15,10 @@ defineProps<{
     dialog-classes="px-4 pt-5 pb-4 sm:p-6 sm:max-w-lg"
   >
     <div>
-      <slot name="icon" />
+      <slot
+        name="icon"
+        role="presentation"
+      />
 
       <div class="mt-3 text-center sm:mt-5">
         <DialogTitle
diff --git a/resources/components/shared/core/BaseButton.vue b/resources/components/shared/core/BaseButton.vue
index 26e31d56..44ff6edf 100644
--- a/resources/components/shared/core/BaseButton.vue
+++ b/resources/components/shared/core/BaseButton.vue
@@ -33,7 +33,7 @@ const classesForSizeProp = {
 }[props.size]
 
 const classesForKindProp = {
-  base: 'text-gray-700 bg-white border-gray-300 hover:bg-gray-50 focus-visible:ring-gray-200 font-medium active:bg-gray-100 hover:dark:bg-gray-900 dark:bg-gray-950 dark:border-black dark:text-gray-200 border shadow-sm dark:shadow-md',
+  base: 'text-gray-700 bg-white border-gray-300 hover:bg-gray-50 focus-visible:ring-gray-200 font-medium active:bg-gray-100 hover:dark:bg-gray-950/50 dark:bg-gray-950 dark:border-black dark:text-gray-200 border shadow-sm dark:shadow-md',
   'base-borderless': 'text-gray-700 bg-transparent focus-visible:ring-brand-200 font-medium dark:text-gray-900',
   danger:
     'text-white bg-red-600 border-transparent hover:bg-red-700 focus-visible:ring-red-200 font-semibold border shadow-sm',
diff --git a/resources/components/shared/dialogs/SettingsDialog/SettingsDialog.vue b/resources/components/shared/dialogs/SettingsDialog/SettingsDialog.vue
index dd80783a..991e81b8 100644
--- a/resources/components/shared/dialogs/SettingsDialog/SettingsDialog.vue
+++ b/resources/components/shared/dialogs/SettingsDialog/SettingsDialog.vue
@@ -73,7 +73,7 @@ const checkSponsorshipStatus = () => {
   <BaseDialog
     :is-open="isOpen"
     :hide="hide"
-    dialog-classes="sm:max-w-[680px] px-0 pt-0 pb-0 sm:p-0 sm:pb-4"
+    dialog-classes="sm:max-w-[680px] px-0 pt-0 pb-0 sm:p-0 sm:pb-4 sm:h-[560px]"
   >
     <DialogTitle
       class="w-full rounded-t-lg border-b border-gray-200 dark:border-gray-700 bg-gray-100 dark:bg-gray-900 py-4 px-5 text-xl font-bold text-gray-700 dark:text-gray-200"
@@ -111,15 +111,9 @@ const checkSponsorshipStatus = () => {
 
                   <p
                     v-show="!isSponsor"
-                    class="flex items-center gap-x-1"
+                    class="text-sm font-bold text-yellow-600 dark:text-yellow-500"
                   >
-                    <span
-                      class="flex h-5 w-5 items-center justify-center rounded-full bg-yellow-500 text-yellow-200 dark:text-yellow-950"
-                    >
-                      <XCircleIcon class="h-5 w-5" />
-                    </span>
-
-                    <span class="text-sm font-bold text-yellow-600 dark:text-yellow-500">Not sponsoring.</span>
+                    Not sponsoring.
                   </p>
                 </div>
               </div>
diff --git a/resources/components/shared/dialogs/SmartFilterDialog.vue b/resources/components/shared/dialogs/SmartFilterDialog.vue
index e9da7055..ef3351a4 100644
--- a/resources/components/shared/dialogs/SmartFilterDialog.vue
+++ b/resources/components/shared/dialogs/SmartFilterDialog.vue
@@ -64,7 +64,6 @@ const updateSmartFilter = async () => {
       await smartFiltersStore.updateSmartFilter(currentSmartFilter.value.id, form.fields)
     }
   } catch (e) {
-    console.log(e)
     const errors = e as Errors
     if (!errors[SPONSORSHIP_REQUIRED_ERROR]) {
       showToast(errors[Object.keys(errors)[0]], ToastType.Error)
diff --git a/resources/components/shared/dialogs/UpgradeAuthScopeDialog.vue b/resources/components/shared/dialogs/UpgradeAuthScopeDialog.vue
index fa25cde7..7fb80b72 100644
--- a/resources/components/shared/dialogs/UpgradeAuthScopeDialog.vue
+++ b/resources/components/shared/dialogs/UpgradeAuthScopeDialog.vue
@@ -14,10 +14,7 @@ const { isOpen, hide, redirectToGitHub } = useUpgradeAuthScopeDialog()
   >
     <template #icon>
       <div class="mx-auto flex h-12 w-12 items-center justify-center rounded-full bg-yellow-100 dark:bg-yellow-400/10">
-        <ExclamationTriangleIcon
-          class="h-6 w-6 text-yellow-800 dark:text-yellow-500"
-          aria-hidden="true"
-        /></div
+        <i-lucide-shield-alert class="h-6 w-6 text-yellow-800 dark:text-yellow-500" /></div
     ></template>
 
     <template #title>Elevated privileges required</template>
diff --git a/resources/components/sidebar/Sidebar.vue b/resources/components/sidebar/Sidebar.vue
index d7a70765..e881067b 100644
--- a/resources/components/sidebar/Sidebar.vue
+++ b/resources/components/sidebar/Sidebar.vue
@@ -41,7 +41,6 @@ const starsStore = useStarsStore()
 const smartFiltersStore = useSmartFiltersStore()
 const { show: showSmartFilterDialog } = useSmartFilterDialog()
 const { show: showSponsorshipDialog } = useSponsorshipDialog()
-const { show: showToast } = useGlobalToast()
 
 const newTagForm = ref<HTMLElement>()
 const newTag = ref('')
@@ -129,7 +128,7 @@ const toggleSidebarGroupCollapsedState = async (key: CollapsibleSidebarSettingsK
               }"
               @click="emit('reload-stars')"
             >
-              <ArrowPathIcon
+              <i-lucide-refresh-cw
                 class="h-4 w-4"
                 :class="{
                   'animate-spin': starsStore.isFetchingStars,
@@ -151,7 +150,7 @@ const toggleSidebarGroupCollapsedState = async (key: CollapsibleSidebarSettingsK
             @click="emit('all-stars-selected')"
           >
             <template #icon>
-              <InboxIcon />
+              <i-lucide-inbox class="w-full h-full" />
             </template>
           </SidebarItem>
 
@@ -162,7 +161,7 @@ const toggleSidebarGroupCollapsedState = async (key: CollapsibleSidebarSettingsK
             @click="emit('untagged-selected')"
           >
             <template #icon>
-              <StarIcon />
+              <i-lucide-star class="w-full h-full" />
             </template>
           </SidebarItem>
         </ul>
@@ -191,9 +190,9 @@ const toggleSidebarGroupCollapsedState = async (key: CollapsibleSidebarSettingsK
               type="button"
               @click="showNewTagForm"
             >
-              <PlusCircleIcon
+              <i-lucide-circle-plus
                 class="h-5 w-5 flex-shrink-0"
-                aria-hidden="true"
+                role="presentation"
               />
 
               <span class="ml-2">Add a tag...</span>
@@ -259,9 +258,9 @@ const toggleSidebarGroupCollapsedState = async (key: CollapsibleSidebarSettingsK
             aria-label="Add smart filter"
             @click="doShowSmartFilterDialog"
           >
-            <PlusCircleIcon
+            <i-lucide-circle-plus
               class="h-5 w-5 flex-shrink-0"
-              aria-hidden="true"
+              role="presentation"
             />
           </button>
         </template>
diff --git a/resources/components/sidebar/SidebarGroup.vue b/resources/components/sidebar/SidebarGroup.vue
index 850042ed..ad21ab72 100644
--- a/resources/components/sidebar/SidebarGroup.vue
+++ b/resources/components/sidebar/SidebarGroup.vue
@@ -22,12 +22,12 @@ defineProps<Props>()
           :as="collapsible ? 'button' : 'h4'"
           @click="close?.()"
         >
-          <CaretIcon
+          <i-lucide-chevron-right
             v-if="collapsible"
             class="relative h-5 w-5 flex-shrink-0 transform"
             :class="{ 'rotate-90': isOpen }"
             style="top: -1px"
-            aria-hidden="true"
+            role="presentation"
           />
 
           <span class="select-none text-xs font-bold uppercase tracking-wider">
diff --git a/resources/components/sidebar/SidebarSmartFilter.vue b/resources/components/sidebar/SidebarSmartFilter.vue
index a23ba578..b79f6e5f 100644
--- a/resources/components/sidebar/SidebarSmartFilter.vue
+++ b/resources/components/sidebar/SidebarSmartFilter.vue
@@ -5,7 +5,6 @@ import { useConfirm } from '@/composables/useConfirm'
 import { useSmartFilterDialog } from '@/composables/useSmartFilterDialog'
 import { useSmartFiltersStore } from '@/store/useSmartFiltersStore'
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
-import { FunnelIcon as FilterIcon } from '@heroicons/vue/24/outline'
 import { EllipsisHorizontalIcon, PencilSquareIcon, TrashIcon } from '@heroicons/vue/24/solid'
 import { ref } from 'vue'
 
@@ -29,6 +28,14 @@ const deleteSmartFilter = async () => {
     smartFiltersStore.deleteSmartFilter(props.smartFilter.id)
   }
 }
+
+const baseMenuItemClasses = 'group/menu-item flex w-full items-center p-2 text-xs font-semibold'
+
+const getMenuItemClasses = (isActive: boolean) => {
+  return isActive
+    ? `${baseMenuItemClasses} bg-indigo-50 text-indigo-700 dark:bg-indigo-400/10 dark:text-indigo-400`
+    : `${baseMenuItemClasses} text-gray-700 dark:text-gray-400`
+}
 </script>
 
 <template>
@@ -40,7 +47,7 @@ const deleteSmartFilter = async () => {
     class="group/sidebar-item rounded-md py-1"
   >
     <template #icon>
-      <FilterIcon />
+      <i-lucide-filter class="w-full h-full" />
     </template>
 
     <template #contextMenu>
@@ -60,7 +67,12 @@ const deleteSmartFilter = async () => {
             :class="[open && 'opacity-100']"
             @click.stop
           >
-            <EllipsisHorizontalIcon />
+            <i-lucide-ellipsis
+              class="w-full-h-full"
+              role="presentation"
+            />
+
+            <span class="sr-only">Smart filter menu</span>
           </MenuButton>
 
           <transition
@@ -72,18 +84,17 @@ const deleteSmartFilter = async () => {
             leave-to-class="transform scale-95 opacity-0"
           >
             <MenuItems
-              class="absolute right-2 z-20 mt-2 w-28 origin-top-right divide-y divide-gray-100 rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:right-0"
+              class="absolute right-2 z-20 mt-2 w-40 origin-top-right divide-y divide-gray-100 rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:right-0 dark:bg-gray-800 dark:border dark:border-gray-700"
             >
               <div class="py-1">
                 <MenuItem v-slot="{ active }">
                   <button
-                    class="group/menu-item flex w-full items-center p-2 text-xs font-semibold"
-                    :class="[active ? 'bg-indigo-50 text-indigo-700' : 'text-gray-700']"
+                    :class="getMenuItemClasses(active)"
                     @click.stop="showSmartFilterDialog(smartFilter)"
                   >
-                    <PencilSquareIcon
+                    <i-lucide-square-pen
                       class="mr-1 h-4 w-4 text-gray-400 group-hover/menu-item:text-indigo-500"
-                      aria-hidden="true"
+                      role="presentation"
                     />
 
                     <span>Edit</span>
@@ -92,13 +103,12 @@ const deleteSmartFilter = async () => {
 
                 <MenuItem v-slot="{ active }">
                   <button
-                    class="group/menu-item flex w-full items-center p-2 text-xs font-semibold"
-                    :class="[active ? 'bg-indigo-50 text-indigo-700' : 'text-gray-700']"
+                    :class="getMenuItemClasses(active)"
                     @click.stop="deleteSmartFilter"
                   >
-                    <TrashIcon
+                    <i-lucide-trash-2
                       class="mr-1 h-4 w-4 text-gray-400 group-hover/menu-item:text-indigo-500"
-                      aria-hidden="true"
+                      role="presentation"
                     />
 
                     <span>Delete</span>
diff --git a/resources/components/sidebar/SidebarTag.vue b/resources/components/sidebar/SidebarTag.vue
index 172e25b4..fe6941cd 100644
--- a/resources/components/sidebar/SidebarTag.vue
+++ b/resources/components/sidebar/SidebarTag.vue
@@ -8,8 +8,6 @@ import { useStarsStore } from '@/store/useStarsStore'
 import { useTagsStore } from '@/store/useTagsStore'
 import { StarDragDataTransferData } from '@/types'
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
-import { EllipsisHorizontalIcon, PencilSquareIcon, TrashIcon } from '@heroicons/vue/24/solid'
-import { Tag as TagIcon } from 'lucide-vue-next'
 import { ref } from 'vue'
 
 const props = defineProps<{
@@ -94,7 +92,7 @@ const getMenuItemClasses = (isActive: boolean) => {
     @drop="onDrop"
   >
     <template #icon>
-      <TagIcon class="w-full h-full" />
+      <i-lucide-tag class="w-full h-full" />
     </template>
 
     <template #contextMenu>
@@ -114,7 +112,12 @@ const getMenuItemClasses = (isActive: boolean) => {
             :class="[open && 'opacity-100']"
             @click.stop
           >
-            <EllipsisHorizontalIcon />
+            <i-lucide-ellipsis
+              class="w-full-h-full"
+              role="presentation"
+            />
+
+            <span class="sr-only">Tag menu</span>
           </MenuButton>
 
           <transition
@@ -134,9 +137,9 @@ const getMenuItemClasses = (isActive: boolean) => {
                     :class="getMenuItemClasses(active)"
                     @click.stop="showRenameTagDialog(tag)"
                   >
-                    <PencilSquareIcon
+                    <i-lucide-square-pen
                       class="mr-1 h-4 w-4 text-gray-400 group-hover/menu-item:text-indigo-500"
-                      aria-hidden="true"
+                      role="presentation"
                     />
 
                     <span>Rename</span>
@@ -148,9 +151,9 @@ const getMenuItemClasses = (isActive: boolean) => {
                     :class="getMenuItemClasses(active)"
                     @click.stop="deleteTag"
                   >
-                    <TrashIcon
+                    <i-lucide-trash-2
                       class="mr-1 h-4 w-4 text-gray-400 group-hover/menu-item:text-indigo-500"
-                      aria-hidden="true"
+                      role="presentation"
                     />
 
                     <span>Delete</span>
diff --git a/resources/components/sidebar/SortTagsMenu.vue b/resources/components/sidebar/SortTagsMenu.vue
index c28621ce..be130df5 100644
--- a/resources/components/sidebar/SortTagsMenu.vue
+++ b/resources/components/sidebar/SortTagsMenu.vue
@@ -1,11 +1,6 @@
 <script lang="ts" setup>
-import NameAZIcon from '@/components/shared/icons/tag-sorting/NameAZIcon.vue'
-import NameZAIcon from '@/components/shared/icons/tag-sorting/NameZAIcon.vue'
-import StarsCountHighIcon from '@/components/shared/icons/tag-sorting/StarsCountHighIcon.vue'
-import StarsCountLowIcon from '@/components/shared/icons/tag-sorting/StarsCountLowIcon.vue'
 import { FetchDirection, TagSortMethod } from '@/types'
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
-import { ArrowsUpDownIcon } from '@heroicons/vue/16/solid'
 
 const emit = defineEmits<{
   (e: 'sortTags', method: TagSortMethod, direction: Lowercase<FetchDirection>): void
@@ -32,9 +27,9 @@ const getMenuItemClasses = (isActive: boolean) => {
     >
       <span class="text-xs uppercase tracking-wider">Sort</span>
 
-      <ArrowsUpDownIcon
+      <i-lucide-arrow-down-up
         class="ml-1 h-4 w-4"
-        aria-hidden="true"
+        role="presentation"
       />
     </MenuButton>
 
@@ -56,7 +51,7 @@ const getMenuItemClasses = (isActive: boolean) => {
               :class="getMenuItemClasses(active)"
               @click="emit('sortTags', 'name', 'asc')"
             >
-              <NameAZIcon
+              <i-lucide-arrow-up-a-z
                 class="mr-1 h-4 w-4 text-gray-400 dark:text-gray-500 group-hover/menu-item:text-indigo-500 dark:group-hover/menu-item:text-indigo-400"
                 aria-hidden="true"
               />
@@ -71,7 +66,7 @@ const getMenuItemClasses = (isActive: boolean) => {
               :class="getMenuItemClasses(active)"
               @click="emit('sortTags', 'name', 'desc')"
             >
-              <NameZAIcon
+              <i-lucide-arrow-down-z-a
                 class="mr-1 h-4 w-4 text-gray-400 dark:text-gray-500 group-hover/menu-item:text-indigo-500 dark:group-hover/menu-item:text-indigo-400"
                 aria-hidden="true"
               />
@@ -86,7 +81,7 @@ const getMenuItemClasses = (isActive: boolean) => {
               :class="getMenuItemClasses(active)"
               @click="emit('sortTags', 'stars_count', 'desc')"
             >
-              <StarsCountHighIcon
+              <i-lucide-arrow-up-1-0
                 class="mr-1 h-4 w-4 text-gray-400 dark:text-gray-500 group-hover/menu-item:text-indigo-500 dark:group-hover/menu-item:text-indigo-400"
                 aria-hidden="true"
               />
@@ -101,7 +96,7 @@ const getMenuItemClasses = (isActive: boolean) => {
               :class="getMenuItemClasses(active)"
               @click="emit('sortTags', 'stars_count', 'asc')"
             >
-              <StarsCountLowIcon
+              <i-lucide-arrow-down-0-1
                 class="mr-1 h-4 w-4 text-gray-400 dark:text-gray-500 group-hover/menu-item:text-indigo-500 dark:group-hover/menu-item:text-indigo-400"
                 aria-hidden="true"
               />
diff --git a/resources/components/stars/StarredRepo.vue b/resources/components/stars/StarredRepo.vue
index debe8b13..eb76ff3b 100644
--- a/resources/components/stars/StarredRepo.vue
+++ b/resources/components/stars/StarredRepo.vue
@@ -4,7 +4,7 @@ import { useAuth } from '@/composables/use-auth'
 import { useStarsStore } from '@/store/useStarsStore'
 import { useTagsStore } from '@/store/useTagsStore'
 import { GitHubRepo, GitHubRepoNode, StarMetaInput, TagEditorTag } from '@/types'
-import { GlobeAmericasIcon as GlobeIcon, ShareIcon, StarIcon } from '@heroicons/vue/16/solid'
+// import { GlobeAmericasIcon as GlobeIcon, ShareIcon, StarIcon } from '@heroicons/vue/16/solid'
 import pick from 'lodash/pick'
 import { computed, ref } from 'vue'
 
@@ -177,29 +177,51 @@ const onDragEnd = () => {
       </li>
     </ul>
 
-    <div class="mt-4 flex items-center space-x-4 text-gray-500 dark:text-gray-400">
-      <div class="flex items-center">
-        <StarIcon class="h-4 w-4" />
+    <div class="mt-4 flex items-center justify-start gap-x-4 text-gray-500 dark:text-gray-400 w-full">
+      <div class="inline-flex items-center">
+        <i-ph-star
+          class="h-4 w-4"
+          role="presentation"
+        />
 
-        <span class="ml-1 text-xs font-medium">{{ repo.node.stargazers.totalCount.toLocaleString() }}</span>
+        <span class="ml-0.5 text-sm font-medium">{{ repo.node.stargazers.totalCount.toLocaleString() }}</span>
       </div>
 
-      <div class="flex items-center">
-        <ShareIcon class="h-4 w-4" />
+      <div class="inline-flex items-center">
+        <i-ph-git-fork
+          class="h-4 w-4"
+          role="presentation"
+        />
 
-        <span class="ml-1 text-xs font-medium">{{ repo.node.forkCount.toLocaleString() }}</span>
+        <span class="ml-0.5 text-sm font-medium">{{ repo.node.forkCount.toLocaleString() }}</span>
       </div>
 
       <a
-        class="group-scope flex items-center transition-colors"
+        class="transition-opacity group-hover:opacity-100 opacity-100 sm:opacity-0 group/repo-link inline-flex items-center ml-auto hover:text-brand-500 px-2 relative"
         :href="repo.node.url"
         target="_blank"
         rel="noopener noreferrer"
         @click.stop
       >
-        <GlobeIcon class="h-4 w-4" />
-
-        <span class="group-scope-hover:underline ml-1 text-xs font-medium">Visit</span>
+        <i-ph-github-logo
+          class="h-5 w-5 transition group-hover/repo-link:rotate-[-30deg]"
+          role="presentation"
+        />
+
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 20 20"
+          class="w-3.5 h-3.5 rotate-[75deg] hidden sm:inline-block sm:opacity-0 transition group-hover/repo-link:opacity-100 relative -top-1"
+          role="presentation"
+        >
+          <path
+            fill="currentColor"
+            d="M6.03 7.03a.75.75 0 0 1-1.06-1.06l4-4a.75.75 0 0 1 1.06 0l4 4a.75.75 0 0 1-1.06 1.06l-2.72-2.72v5.44c0 1.947.245 3.321.74 4.366c.486 1.026 1.243 1.8 2.396 2.49a.75.75 0 1 1-.772 1.287c-1.347-.808-2.34-1.785-2.98-3.134c-.63-1.33-.884-2.956-.884-5.009V4.31z"
+          />
+        </svg>
+
+        <!-- <span class="group-hover/repo-link:underline ml-0.5 text-sm font-medium">Visit</span> -->
+        <span class="sr-only">Visit</span>
       </a>
     </div>
   </div>
diff --git a/resources/components/toolbar/RepoToolbar.vue b/resources/components/toolbar/RepoToolbar.vue
index 2803ed47..85d19990 100644
--- a/resources/components/toolbar/RepoToolbar.vue
+++ b/resources/components/toolbar/RepoToolbar.vue
@@ -73,9 +73,14 @@ onKeyStroke('n', e => {
         size="sm"
         @click="handleToggleNotesEditor()"
       >
-        <component
-          :is="currentStarHasNotes ? ExistingNoteIcon : EmptyNoteIcon"
-          class="-ml-2 h-4"
+        <i-lucide-notebook
+          v-if="currentStarHasNotes"
+          class="h-4"
+        />
+
+        <i-lucide-notebook-text
+          v-else
+          class="h-4"
         />
 
         <span class="ml-0.5">{{ isNotesEditorOpen ? 'Hide' : 'Show' }} notes</span>
@@ -88,7 +93,10 @@ onKeyStroke('n', e => {
         class="ml-2"
         @click="removeSelectedStar"
       >
-        <StarIcon class="-ml-1 h-4" />
+        <i-lucide-star-off
+          class="-ml-1 h-4"
+          role="presentation"
+        />
 
         <span class="ml-1">Unstar</span>
       </BaseButton>
diff --git a/resources/views/dashboard.vue b/resources/views/dashboard.vue
index 852da725..62bc2419 100644
--- a/resources/views/dashboard.vue
+++ b/resources/views/dashboard.vue
@@ -237,10 +237,10 @@ tryOnMounted(() => {
           @click="isSidebarOpen = !isSidebarOpen"
         >
           <div
-            class="inline-flex h-10 w-10 items-center justify-center text-4xl text-white"
-            aria-hidden="true"
+            class="inline-flex h-8 w-8 items-center justify-center text-4xl text-white/75"
+            role="presentation"
           >
-            <CloseIcon />
+            <i-lucide-circle-x class="w-full h-full" />
           </div>
         </button>
       </div>
diff --git a/vite.config.ts b/vite.config.ts
index 4e11f203..3c42574d 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -5,7 +5,6 @@ import svgLoader from 'vite-svg-loader'
 export default defineConfig({
   plugins: [
     hybridly({
-      icons: false,
       laravel: {
         detectTls: true,
       },