diff --git a/package.json b/package.json
index d327062..961366c 100644
--- a/package.json
+++ b/package.json
@@ -30,7 +30,7 @@
 		"svelte-vertical-timeline": "^0.0.2",
 		"tslib": "^2.4.0",
 		"typescript": "^4.7.4",
-		"unplugin-icons": "^0.14.7",
+		"unocss": "^0.45.5",
 		"vite": "^3.0.4"
 	},
 	"type": "module"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 410b767..0bdf98b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -18,7 +18,7 @@ specifiers:
   svelte-vertical-timeline: ^0.0.2
   tslib: ^2.4.0
   typescript: ^4.7.4
-  unplugin-icons: ^0.14.7
+  unocss: ^0.45.5
   vite: ^3.0.4
 
 devDependencies:
@@ -39,11 +39,19 @@ devDependencies:
   svelte-vertical-timeline: 0.0.2
   tslib: 2.4.0
   typescript: 4.7.4
-  unplugin-icons: 0.14.7_vite@3.0.4
+  unocss: 0.45.5_vite@3.0.4
   vite: 3.0.4
 
 packages:
 
+  /@ampproject/remapping/2.2.0:
+    resolution: {integrity: sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==}
+    engines: {node: '>=6.0.0'}
+    dependencies:
+      '@jridgewell/gen-mapping': 0.1.1
+      '@jridgewell/trace-mapping': 0.3.14
+    dev: true
+
   /@antfu/install-pkg/0.1.0:
     resolution: {integrity: sha512-VaIJd3d1o7irZfK1U0nvBsHMyjkuyMP3HKYVV53z8DKyulkHKmjhhtccXO51WSPeeSHIeoJEoNOKavYpS7jkZw==}
     dependencies:
@@ -84,11 +92,24 @@ packages:
       - supports-color
     dev: true
 
+  /@jridgewell/gen-mapping/0.1.1:
+    resolution: {integrity: sha512-sQXCasFk+U8lWYEe66WxRDOE9PjVz4vSM51fTu3Hw+ClTpUSQb718772vH3pyS5pShp6lvQM7SxgIDXXXmOX7w==}
+    engines: {node: '>=6.0.0'}
+    dependencies:
+      '@jridgewell/set-array': 1.1.2
+      '@jridgewell/sourcemap-codec': 1.4.14
+    dev: true
+
   /@jridgewell/resolve-uri/3.1.0:
     resolution: {integrity: sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==}
     engines: {node: '>=6.0.0'}
     dev: true
 
+  /@jridgewell/set-array/1.1.2:
+    resolution: {integrity: sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==}
+    engines: {node: '>=6.0.0'}
+    dev: true
+
   /@jridgewell/sourcemap-codec/1.4.14:
     resolution: {integrity: sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==}
     dev: true
@@ -121,6 +142,10 @@ packages:
       fastq: 1.13.0
     dev: true
 
+  /@polka/url/1.0.0-next.21:
+    resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==}
+    dev: true
+
   /@rollup/pluginutils/4.2.1:
     resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
     engines: {node: '>= 8.0.0'}
@@ -194,10 +219,145 @@ packages:
     resolution: {integrity: sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==}
     dev: true
 
-  /acorn/8.8.0:
-    resolution: {integrity: sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==}
-    engines: {node: '>=0.4.0'}
+  /@unocss/cli/0.45.5:
+    resolution: {integrity: sha512-gB/XZ6ksS/le1r33JhLam7UtJhd2fvtbgYV2rU76DOoqIa+qCZFbrMDFyF+PJz6yCW0goYF9ybtZXND42aygZQ==}
+    engines: {node: '>=14'}
     hasBin: true
+    dependencies:
+      '@unocss/config': 0.45.5
+      '@unocss/core': 0.45.5
+      '@unocss/preset-uno': 0.45.5
+      cac: 6.7.12
+      chokidar: 3.5.3
+      colorette: 2.0.19
+      consola: 2.15.3
+      fast-glob: 3.2.11
+      pathe: 0.3.3
+      perfect-debounce: 0.1.3
+    dev: true
+
+  /@unocss/config/0.45.5:
+    resolution: {integrity: sha512-wae2RmItmaSsXcMPb9dOzrfQlG6SDgbuUmyuXydJi7VZmj/5a/a1cRTny/J2/eP1kS5aUNgCm/FzpletH59mfw==}
+    engines: {node: '>=14'}
+    dependencies:
+      '@unocss/core': 0.45.5
+      unconfig: 0.3.5
+    dev: true
+
+  /@unocss/core/0.45.5:
+    resolution: {integrity: sha512-6boP8sGTRb+nE87pdjii7otO/tguIlDkFh90E6mglA0XdjHWiLCCNlgJoxgjCGCPNYUm/Nojx0bUbcokuqBZDw==}
+    dev: true
+
+  /@unocss/inspector/0.45.5:
+    resolution: {integrity: sha512-OM1bmmt8Qbsdt4AvokI/HAYVrHWOYwsNyisEhgGRQiOuc6JuFx1+B1T8hyELBRZfunvfm4J6qDJ3qGqPZWFU9g==}
+    dependencies:
+      gzip-size: 6.0.0
+      sirv: 2.0.2
+    dev: true
+
+  /@unocss/preset-attributify/0.45.5:
+    resolution: {integrity: sha512-xgjsuYDB5EYqXaCa73B9Tk19y6U8482S/trf6kcbSSGLaEcXhOQMdo8xtUJPyacwoCG0ralCgWIgWeb/VQ0noQ==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/preset-icons/0.45.5:
+    resolution: {integrity: sha512-msrhKKEWh5HMyQXnseKjMTe8dZZZl/URaxCtDkIhzGJHzDvTAiU7kDr6pAr3Uxw2DgDEviq159W22679JyaBHg==}
+    dependencies:
+      '@iconify/utils': 1.0.33
+      '@unocss/core': 0.45.5
+      ohmyfetch: 0.4.18
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@unocss/preset-mini/0.45.5:
+    resolution: {integrity: sha512-R8FDinKThZBTIqwuYokI8GHOTxt8x11W/dY4wyXOFXXiGW2kmL7fjhB3KNN3sfyhyp+k2g5CW40XJ13rOunODw==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/preset-tagify/0.45.5:
+    resolution: {integrity: sha512-fRUEh8EuJUjXHvJNzbPquC6Ih51mIygFmNaBXr9W9SNQYgYF9Z9Xy/2rFD3ADaI6L52JUIEV0OZgt1E/QJpAng==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/preset-typography/0.45.5:
+    resolution: {integrity: sha512-4F2hRDsuE8BCA0MZIaRjClXIVQkePQsQyz+s3qw89Fndeatj+Yd5VrKEPBBz3g9062A6dUGfgWUyy4o+SAOCvA==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/preset-uno/0.45.5:
+    resolution: {integrity: sha512-eo0do6sS1xMRaeOvxkxEjFXZoh0Pm5g1c8bb3WpNMogcp9l8t22JCkSLo5dq+dnC+nQduOzt/GJoA+XksQeEsw==}
+    dependencies:
+      '@unocss/core': 0.45.5
+      '@unocss/preset-mini': 0.45.5
+      '@unocss/preset-wind': 0.45.5
+    dev: true
+
+  /@unocss/preset-web-fonts/0.45.5:
+    resolution: {integrity: sha512-wusZRdGXpAVWbdyNP7Cd7D1hWuAEG1jch4kXzRNyjZ4Uo7ImGY42yEysjXpuNizA29i0Xe9FtT99kCqOcQwHRQ==}
+    dependencies:
+      '@unocss/core': 0.45.5
+      ohmyfetch: 0.4.18
+    dev: true
+
+  /@unocss/preset-wind/0.45.5:
+    resolution: {integrity: sha512-N4kr5SG4WjqJ4hI+4Fp8QlB5u7pTtAGY1WDVPeKwh3lX2iE01BnQhL6W6ds7BjXSdGm/yUQwBCedpnAfzWqutQ==}
+    dependencies:
+      '@unocss/core': 0.45.5
+      '@unocss/preset-mini': 0.45.5
+    dev: true
+
+  /@unocss/reset/0.45.5:
+    resolution: {integrity: sha512-JDFRoc1H0Tk1knRGI+LljOKrKkWrF1txJ50DG3oa+azTdQaX0wDQ4isyDM6PbodydhEqYCsZcJEL/2pEiPRg8A==}
+    dev: true
+
+  /@unocss/scope/0.45.5:
+    resolution: {integrity: sha512-+7PPbxxVp/k27YyBVSM/euKnB65KtaXA4iYHiDWRja235RnnsZ7XcSZ78o5hDuOA3dnqZU+d4rV5rt1tGy6XJA==}
+    dev: true
+
+  /@unocss/transformer-attributify-jsx/0.45.5:
+    resolution: {integrity: sha512-e4l5G7ZLhSeIkHM6mo6KfXZbQDi6XFcTNQRJStXF6t2UjqABAtR/jLCUzkyK7khaLE4QxduRhCHCfR/VyYvCyg==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/transformer-compile-class/0.45.5:
+    resolution: {integrity: sha512-R08rLO3XZyk5g1BQ01GT+0AuztVpj+g6e+B+4NeoMF3LhShA4Zg+yqn7awa2d5/1tXwpMYO4kwyBFZzQf0WzBw==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/transformer-directives/0.45.5:
+    resolution: {integrity: sha512-k+QZetHGcSmxXMlE2UfkfnzFJ865FBxnT5EZCU/dlL1B2momDi19n2q0Hc9DnX/GjbLtrzurQFrq+Xy4gQ7HcA==}
+    dependencies:
+      '@unocss/core': 0.45.5
+      css-tree: 2.1.0
+    dev: true
+
+  /@unocss/transformer-variant-group/0.45.5:
+    resolution: {integrity: sha512-Qp0g+9U//cXV7u6dojXw3tafs1saRW+nViMdfCjEKWz3TStFssI9IAhwg5wIZoYYLSSCVMfBTc96OkDvO1m9rA==}
+    dependencies:
+      '@unocss/core': 0.45.5
+    dev: true
+
+  /@unocss/vite/0.45.5_vite@3.0.4:
+    resolution: {integrity: sha512-QVNj9xDBJ46RC1D+rSFiGWywazq6z7MVszrpifCACtA8qKdWbrWuI8beEpfo3pBpf7uYFIb+Df6CU9gCD809Og==}
+    peerDependencies:
+      vite: ^2.9.0 || ^3.0.0-0
+    dependencies:
+      '@ampproject/remapping': 2.2.0
+      '@rollup/pluginutils': 4.2.1
+      '@unocss/config': 0.45.5
+      '@unocss/core': 0.45.5
+      '@unocss/inspector': 0.45.5
+      '@unocss/scope': 0.45.5
+      '@unocss/transformer-directives': 0.45.5
+      magic-string: 0.26.2
+      vite: 3.0.4
     dev: true
 
   /anymatch/3.1.2:
@@ -235,6 +395,11 @@ packages:
     resolution: {integrity: sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==}
     dev: true
 
+  /cac/6.7.12:
+    resolution: {integrity: sha512-rM7E2ygtMkJqD9c7WnFU6fruFcN3xe4FM5yUmgxhZzIKJk4uHl9U/fhwdajGFQbQuv43FAUo1Fe8gX/oIKDeSA==}
+    engines: {node: '>=8'}
+    dev: true
+
   /callsites/3.1.0:
     resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
     engines: {node: '>=6'}
@@ -255,10 +420,18 @@ packages:
       fsevents: 2.3.2
     dev: true
 
+  /colorette/2.0.19:
+    resolution: {integrity: sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==}
+    dev: true
+
   /concat-map/0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
     dev: true
 
+  /consola/2.15.3:
+    resolution: {integrity: sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw==}
+    dev: true
+
   /cross-spawn/7.0.3:
     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
     engines: {node: '>= 8'}
@@ -268,6 +441,14 @@ packages:
       which: 2.0.2
     dev: true
 
+  /css-tree/2.1.0:
+    resolution: {integrity: sha512-PcysZRzToBbrpoUrZ9qfblRIRf8zbEAkU0AIpQFtgkFK0vSbzOmBCvdSAx2Zg7Xx5wiYJKUKk0NMP7kxevie/A==}
+    engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
+    dependencies:
+      mdn-data: 2.0.27
+      source-map-js: 1.0.2
+    dev: true
+
   /dayjs/1.11.4:
     resolution: {integrity: sha512-Zj/lPM5hOvQ1Bf7uAvewDaUcsJoI6JmNqmHhHl3nyumwe0XHwt8sWdOVAPACJzCebL8gQCi+K49w7iKWnGwX9g==}
     dev: true
@@ -289,11 +470,23 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /defu/6.0.0:
+    resolution: {integrity: sha512-t2MZGLf1V2rV4VBZbWIaXKdX/mUcYW0n2znQZoADBkGGxYL8EWqCuCZBmJPJ/Yy9fofJkyuuSuo5GSwo0XdEgw==}
+    dev: true
+
+  /destr/1.1.1:
+    resolution: {integrity: sha512-QqkneF8LrYmwATMdnuD2MLI3GHQIcBnG6qFC2q9bSH430VTCDAVjcspPmUaKhPGtAtPAftIUFqY1obQYQuwmbg==}
+    dev: true
+
   /detect-indent/6.1.0:
     resolution: {integrity: sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==}
     engines: {node: '>=8'}
     dev: true
 
+  /duplexer/0.1.2:
+    resolution: {integrity: sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==}
+    dev: true
+
   /es6-promise/3.3.1:
     resolution: {integrity: sha512-SOp9Phqvqn7jtEUxPWdWfWoLmyt2VaJ6MpvP9Comy1MceMXqE6bxvaTu4iaxpYYPzhny28Lc+M87/c2cPK6lDg==}
     dev: true
@@ -608,6 +801,13 @@ packages:
     resolution: {integrity: sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==}
     dev: true
 
+  /gzip-size/6.0.0:
+    resolution: {integrity: sha512-ax7ZYomf6jqPTQ4+XCpUGyXKHk5WweS+e05MBO4/y3WJ5RkmPXNKvX+bx1behVILVwr6JSQvZAku021CHPXG3Q==}
+    engines: {node: '>=10'}
+    dependencies:
+      duplexer: 0.1.2
+    dev: true
+
   /has/1.0.3:
     resolution: {integrity: sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==}
     engines: {node: '>= 0.4.0'}
@@ -678,6 +878,11 @@ packages:
     resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
     dev: true
 
+  /jiti/1.14.0:
+    resolution: {integrity: sha512-4IwstlaKQc9vCTC+qUXLM1hajy2ImiL9KnLvVYiaHOtS/v3wRjhLlGl121AmgDgx/O43uKmxownJghS5XMya2A==}
+    hasBin: true
+    dev: true
+
   /kleur/4.1.5:
     resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==}
     engines: {node: '>=6'}
@@ -712,6 +917,10 @@ packages:
       sourcemap-codec: 1.4.8
     dev: true
 
+  /mdn-data/2.0.27:
+    resolution: {integrity: sha512-kwqO0I0jtWr25KcfLm9pia8vLZ8qoAKhWZuZMbneJq3jjBD3gl5nZs8l8Tu3ZBlBAHVQtDur9rdDGyvtfVraHQ==}
+    dev: true
+
   /mdsvex/0.10.6_svelte@3.49.0:
     resolution: {integrity: sha512-aGRDY0r5jx9+OOgFdyB9Xm3EBr9OUmcrTDPWLB7a7g8VPRxzPy4MOBmcVYgz7ErhAJ7bZ/coUoj6aHio3x/2mA==}
     peerDependencies:
@@ -773,6 +982,11 @@ packages:
     engines: {node: '>=4'}
     dev: true
 
+  /mrmime/1.0.1:
+    resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
+    engines: {node: '>=10'}
+    dev: true
+
   /ms/2.1.2:
     resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
     dev: true
@@ -783,6 +997,10 @@ packages:
     hasBin: true
     dev: true
 
+  /node-fetch-native/0.1.4:
+    resolution: {integrity: sha512-10EKpOCQPXwZVFh3U1ptOMWBgKTbsN7Vvo6WVKt5pw4hp8zbv6ZVBZPlXw+5M6Tyi1oc1iD4/sNPd71KYA16tQ==}
+    dev: true
+
   /normalize-path/3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
@@ -795,6 +1013,15 @@ packages:
       path-key: 3.1.1
     dev: true
 
+  /ohmyfetch/0.4.18:
+    resolution: {integrity: sha512-MslzNrQzBLtZHmiZBI8QMOcMpdNFlK61OJ34nFNFynZ4v+4BonfCQ7VIN4EGXvGGq5zhDzgdJoY3o9S1l2T7KQ==}
+    dependencies:
+      destr: 1.1.1
+      node-fetch-native: 0.1.4
+      ufo: 0.8.5
+      undici: 5.8.1
+    dev: true
+
   /once/1.4.0:
     resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
     dependencies:
@@ -848,6 +1075,14 @@ packages:
     resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
     dev: true
 
+  /pathe/0.3.3:
+    resolution: {integrity: sha512-x3nrPvG0HDSDzUiJ0WqtzhN4MD+h5B+dFJ3/qyxVuARlr4Y3aJv8gri2cZzp9Z8sGs2a+aG9gNbKngh3gme57A==}
+    dev: true
+
+  /perfect-debounce/0.1.3:
+    resolution: {integrity: sha512-NOT9AcKiDGpnV/HBhI22Str++XWcErO/bALvHCuhv33owZW/CjH8KAFLZDCmu3727sihe0wTxpDhyGc6M8qacQ==}
+    dev: true
+
   /picocolors/1.0.0:
     resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
     dev: true
@@ -982,6 +1217,15 @@ packages:
     resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
     dev: true
 
+  /sirv/2.0.2:
+    resolution: {integrity: sha512-4Qog6aE29nIjAOKe/wowFTxOdmbEZKb+3tsLljaBRzJwtqto0BChD2zzH0LhgCSXiI+V7X+Y45v14wBZQ1TK3w==}
+    engines: {node: '>= 10'}
+    dependencies:
+      '@polka/url': 1.0.0-next.21
+      mrmime: 1.0.1
+      totalist: 3.0.0
+    dev: true
+
   /sorcery/0.10.0:
     resolution: {integrity: sha512-R5ocFmKZQFfSTstfOtHjJuAwbpGyf9qjQa1egyhvXSbM7emjrtLXtGdZsDJDABC85YBfVvrOiGWKSYXPKdvP1g==}
     hasBin: true
@@ -1145,6 +1389,11 @@ packages:
       is-number: 7.0.0
     dev: true
 
+  /totalist/3.0.0:
+    resolution: {integrity: sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw==}
+    engines: {node: '>=6'}
+    dev: true
+
   /tslib/2.4.0:
     resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==}
     dev: true
@@ -1155,66 +1404,57 @@ packages:
     hasBin: true
     dev: true
 
+  /ufo/0.8.5:
+    resolution: {integrity: sha512-e4+UtA5IRO+ha6hYklwj6r7BjiGMxS0O+UaSg9HbaTefg4kMkzj4tXzEBajRR+wkxf+golgAWKzLbytCUDMJAA==}
+    dev: true
+
+  /unconfig/0.3.5:
+    resolution: {integrity: sha512-YMnPPUSfW0pT4Zzy4inM8tRHJZmhH+KcuFW/3qxkLKPhswEw18gQYe1jt57jY6ctFB0fnpiCpQ2Jtkbg4y/IPA==}
+    dependencies:
+      '@antfu/utils': 0.5.2
+      defu: 6.0.0
+      jiti: 1.14.0
+    dev: true
+
+  /undici/5.8.1:
+    resolution: {integrity: sha512-iDRmWX4Zar/4A/t+1LrKQRm102zw2l9Wgat3LtTlTn8ykvMZmAmpq9tjyHEigx18FsY7IfATvyN3xSw9BDz0eA==}
+    engines: {node: '>=12.18'}
+    dev: true
+
   /unist-util-stringify-position/2.0.3:
     resolution: {integrity: sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g==}
     dependencies:
       '@types/unist': 2.0.6
     dev: true
 
-  /unplugin-icons/0.14.7_vite@3.0.4:
-    resolution: {integrity: sha512-TrNnEdpaXMdiG5BsCgvU6cv/gSLYvIk1f8wGCGZmOo4wmi3nqYBuqIEuiXhmmyXdDZuRRpCaOzCnCYYZ5H7U8g==}
+  /unocss/0.45.5_vite@3.0.4:
+    resolution: {integrity: sha512-dHmyAnTnkoffgXHjWpJIK2iwCDK9HEWkdHrz+Wh114G/ZcX3vQWlpnvboo36oW0V37UaqbId5ajwHRHE6SNo4g==}
+    engines: {node: '>=14'}
     peerDependencies:
-      '@svgr/core': '>=5.5.0'
-      '@vue/compiler-sfc': ^3.0.2
-      vue-template-compiler: ^2.6.12
-      vue-template-es2015-compiler: ^1.9.0
+      '@unocss/webpack': 0.45.5
     peerDependenciesMeta:
-      '@svgr/core':
-        optional: true
-      '@vue/compiler-sfc':
-        optional: true
-      vue-template-compiler:
-        optional: true
-      vue-template-es2015-compiler:
+      '@unocss/webpack':
         optional: true
     dependencies:
-      '@antfu/install-pkg': 0.1.0
-      '@antfu/utils': 0.5.2
-      '@iconify/utils': 1.0.33
-      debug: 4.3.4
-      kolorist: 1.5.1
-      local-pkg: 0.4.2
-      unplugin: 0.7.2_vite@3.0.4
+      '@unocss/cli': 0.45.5
+      '@unocss/core': 0.45.5
+      '@unocss/preset-attributify': 0.45.5
+      '@unocss/preset-icons': 0.45.5
+      '@unocss/preset-mini': 0.45.5
+      '@unocss/preset-tagify': 0.45.5
+      '@unocss/preset-typography': 0.45.5
+      '@unocss/preset-uno': 0.45.5
+      '@unocss/preset-web-fonts': 0.45.5
+      '@unocss/preset-wind': 0.45.5
+      '@unocss/reset': 0.45.5
+      '@unocss/transformer-attributify-jsx': 0.45.5
+      '@unocss/transformer-compile-class': 0.45.5
+      '@unocss/transformer-directives': 0.45.5
+      '@unocss/transformer-variant-group': 0.45.5
+      '@unocss/vite': 0.45.5_vite@3.0.4
     transitivePeerDependencies:
-      - esbuild
-      - rollup
       - supports-color
       - vite
-      - webpack
-    dev: true
-
-  /unplugin/0.7.2_vite@3.0.4:
-    resolution: {integrity: sha512-m7thX4jP8l5sETpLdUASoDOGOcHaOVtgNyrYlToyQUvILUtEzEnngRBrHnAX3IKqooJVmXpoa/CwQ/QqzvGaHQ==}
-    peerDependencies:
-      esbuild: '>=0.13'
-      rollup: ^2.50.0
-      vite: ^2.3.0 || ^3.0.0-0
-      webpack: 4 || 5
-    peerDependenciesMeta:
-      esbuild:
-        optional: true
-      rollup:
-        optional: true
-      vite:
-        optional: true
-      webpack:
-        optional: true
-    dependencies:
-      acorn: 8.8.0
-      chokidar: 3.5.3
-      vite: 3.0.4
-      webpack-sources: 3.2.3
-      webpack-virtual-modules: 0.4.4
     dev: true
 
   /vfile-message/2.0.4:
@@ -1251,15 +1491,6 @@ packages:
       fsevents: 2.3.2
     dev: true
 
-  /webpack-sources/3.2.3:
-    resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
-    engines: {node: '>=10.13.0'}
-    dev: true
-
-  /webpack-virtual-modules/0.4.4:
-    resolution: {integrity: sha512-h9atBP/bsZohWpHnr+2sic8Iecb60GxftXsWNLLLSqewgIsGzByd2gcIID4nXcG+3tNe4GQG3dLcff3kXupdRA==}
-    dev: true
-
   /which/2.0.2:
     resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
     engines: {node: '>= 8'}
diff --git a/src/lib/Card/Link.svelte b/src/lib/Card/Link.svelte
index ab7dd69..1523589 100644
--- a/src/lib/Card/Link.svelte
+++ b/src/lib/Card/Link.svelte
@@ -12,11 +12,13 @@
 	.email,
 	.picture,
 	.pgp {
-		background-color: var(--tertiary);
-		color: #fff !important;
+		background-color: var(--alt);
+		color: var(--alt-text);
 		font-size: 20px;
 		height: 23px;
 		transition: all 0.25s;
+		display: flex;
+		align-items: center;
 	}
 
 	.web:hover,
@@ -24,28 +26,34 @@
 	.picture:hover,
 	.pgp:hover {
 		background-color: var(--accent);
-		color: #333 !important;
+		color: var(--alt);
 	}
 
 	.matrixcolored {
-		background-color: #333;
-		color: #fff !important;
+		background-color: var(--alt);
+		color: var(--alt-text);
 		font-size: 20px;
 		height: 23px;
+		display: flex;
+		align-items: center;
 	}
 
 	.discordcolored {
 		background-color: #5865f2;
-		color: #fff !important;
+		color: #fff;
 		font-size: 20px;
 		height: 23px;
+		display: flex;
+		align-items: center;
 	}
 
 	.githubcolored {
 		background-color: #333;
-		color: #fff !important;
+		color: #fff;
 		font-size: 20px;
 		height: 23px;
+		display: flex;
+		align-items: center;
 	}
 
 	a {
diff --git a/src/lib/ContactForm.svelte b/src/lib/ContactForm.svelte
index f9e4003..1d83a60 100644
--- a/src/lib/ContactForm.svelte
+++ b/src/lib/ContactForm.svelte
@@ -1,6 +1,4 @@
 <script lang="ts">
-	import IconLock from "~icons/fa6-solid/lock";
-	import IconInfo from "~icons/fa6-solid/circle-info";
 	import HCaptcha from "svelte-hcaptcha";
 	let submit = false;
 
@@ -15,7 +13,7 @@
 	id="contact-form"
 >
 	<div class="note">
-		<IconLock />
+		<div class="i-fa6-solid:lock"></div>
 		<b>Your IP will be logged for anti-abuse measures.</b>
 	</div>
 	<div class="meta">
@@ -44,12 +42,11 @@
 		placeholder="Your message"
 	/>
 	<div class="note">
-		<IconInfo />
+		<div class="i-fa6-solid:circle-info"></div>
 		<b>The submit button will be visible when you complete the Captcha.</b>
 	</div>
 	<HCaptcha
 		sitekey="67e84266-980c-4050-8a39-142a91928fe8"
-		theme="dark"
 		on:success={showSubmitButton}
 	/>
 	{#if submit}
@@ -99,7 +96,7 @@
 	}
 
 	.form-textbox {
-		background-color: var(--tertiary);
+		background-color: var(--secondary);
 		color: var(--text);
 		border-radius: 10px;
 		border: none;
@@ -109,7 +106,7 @@
 	}
 
 	.button {
-		background-color: var(--tertiary);
+		background-color: var(--secondary);
 		border: none;
 		border-radius: 10px;
 		padding: 0.5rem;
diff --git a/src/lib/Nav.svelte b/src/lib/Nav.svelte
index 44a5997..e75723f 100644
--- a/src/lib/Nav.svelte
+++ b/src/lib/Nav.svelte
@@ -1,7 +1,4 @@
 <script lang="ts">
-	import IconBars from "~icons/fa6-solid/bars";
-	import IconMatrix from "~icons/simple-icons/matrix";
-	import IconGitHub from "~icons/simple-icons/github";
 	import ThemeToggle from "./ThemeToggle.svelte";
 	import { page } from "$app/stores";
 
@@ -30,8 +27,7 @@
 
 	<input type="checkbox" id="toggle-menu" />
 	<label class="menu-icon" for="toggle-menu">
-		<div id="menu-icon">
-			<IconBars />
+		<div id="menu-icon" class="i-fa6-solid:bars">
 		</div>
 	</label>
 
@@ -46,10 +42,10 @@
 			>
 		{/each}
 		<a href="https://matrix.to/#/#project-segfault:projectsegfau.lt/">
-			<IconMatrix />
+			<div class="i-simple-icons:matrix"></div>
 		</a>
 		<a href="https://github.com/ProjectSegfault/">
-			<IconGitHub />
+			<div class="i-simple-icons:github"></div>
 		</a>
 		<div>
 			<ThemeToggle />
diff --git a/src/lib/ThemeToggle.svelte b/src/lib/ThemeToggle.svelte
index d326cf0..089e800 100644
--- a/src/lib/ThemeToggle.svelte
+++ b/src/lib/ThemeToggle.svelte
@@ -2,8 +2,6 @@
 	import { afterUpdate } from "svelte";
 	import DarkMode from "svelte-dark-mode";
 	import type { Theme } from "svelte-dark-mode/types/DarkMode.svelte";
-	import IconSun from "~icons/fa6-solid/sun";
-	import IconMoon from "~icons/fa6-solid/moon";
 
 	let theme: Theme;
 
@@ -19,12 +17,10 @@
 <DarkMode bind:theme />
 
 {#if theme === "dark"}
-	<div on:click={toggle}>
-		<IconSun />
+	<div on:click={toggle} class="i-fa6-solid:sun">
 	</div>
 {:else if theme === "light"}
-	<div on:click={toggle}>
-		<IconMoon />
+	<div on:click={toggle} class="i-fa6-solid:moon">
 	</div>
 {/if}
 
diff --git a/src/lib/app.css b/src/lib/app.css
index 7296767..eba57ba 100644
--- a/src/lib/app.css
+++ b/src/lib/app.css
@@ -14,6 +14,8 @@ html {
 	--tertiary: #353535;
 	--text: #ffffffde;
 	--grey: #5454547a;
+	--alt: #333;
+	--alt-text: #ddd
 }
 
 html.light {
@@ -22,6 +24,8 @@ html.light {
 	--tertiary: #939393;
 	--text: #444444;
 	--grey: #444444;
+	--alt: #ddd;
+	--alt-text: #333;
 }
 
 body {
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 065d1fa..2b9cbe1 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -3,6 +3,7 @@
 	import Nav from "$lib/Nav.svelte";
 	import Footer from "$lib/Footer.svelte";
 	import SvelteSeo from "svelte-seo";
+	import "uno.css";
 </script>
 
 <SvelteSeo
diff --git a/src/routes/faq.md b/src/routes/faq.md
index cfda746..5438177 100644
--- a/src/routes/faq.md
+++ b/src/routes/faq.md
@@ -11,7 +11,7 @@ The project doesn't have a single owner but is made up of a team of people. A li
 
 ## What's the backstory to Project Segfault?
 
-We have a rather interesting backstory, if I do say so myself. [Click here to see a timeline of things that happened in Project Segfault's history](/timeline)
+We have a rather interesting backstory, if I do say so myself. [Click here to see a timeline of things that happened in Project Segfault's history](/timeline).
 
 ## One of your services contains toxic people!
 
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 1765205..c2aff87 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,9 +1,6 @@
 <script lang="ts">
 	import SvelteSeo from "svelte-seo";
 	import Hero from "$lib/Hero.svelte";
-	import IconMoneyBill from "~icons/fa6-solid/money-bill";
-	import IconCircleInfo from "~icons/fa6-solid/circle-info";
-	import IconTriangleExclamation from "~icons/fa6-solid/triangle-exclamation";
 	import dayjs from "dayjs";
 
 	let description: string = "Open source development and hosted services.";
@@ -29,7 +26,7 @@
 	<div class="buttons">
 		<a href="/instances">Explore our services</a>
 		<a href="/projects">Explore our projects</a>
-		<a href="/donate"><IconMoneyBill /> Donate</a>
+		<a href="/donate"><div class="i-fa6-solid:money-bill"></div> Donate</a>
 	</div>
 </Hero>
 
@@ -41,9 +38,9 @@
 			<div class="announcement">
 				<div class="general">
 					{#if announcements.severity === "info"}
-						<IconCircleInfo />
+						<div class="i-fa6-solid:circle-info"></div>
 					{:else}
-						<IconTriangleExclamation />
+						<div class="i-fa6-solid:triangle-exclamation"></div>
 					{/if}
 					<span>
 						{dayjs
diff --git a/src/routes/projects.svelte b/src/routes/projects.svelte
index 1757a22..e34ff07 100644
--- a/src/routes/projects.svelte
+++ b/src/routes/projects.svelte
@@ -1,10 +1,6 @@
 <script lang="ts">
 	import { CardInner, CardOuter, Link, LinksOuter } from "$lib/Card";
 	import projects from "$lib/Projects.json";
-	import IconGitHub from "~icons/simple-icons/github";
-	import IconGlobe from "~icons/fa6-solid/globe";
-	import IconEmail from "~icons/fa6-solid/envelope";
-	import IconCamera from "~icons/fa6-solid/camera";
 </script>
 
 <svelte:head>
@@ -19,13 +15,13 @@
 			<LinksOuter>
 				{#if website}
 					<Link url={website} classes="web">
-						<IconGlobe />
+						<div class="i-fa6-solid:globe"></div>
 					</Link>
 				{/if}
 
 				{#if github}
 					<Link url={github} classes="githubcolored">
-						<IconGitHub />
+						<div class="i-simple-icons:github"></div>
 					</Link>
 				{/if}
 			</LinksOuter>
diff --git a/src/routes/team.svelte b/src/routes/team.svelte
index 2d73829..ba3c93f 100644
--- a/src/routes/team.svelte
+++ b/src/routes/team.svelte
@@ -1,13 +1,6 @@
 <script lang="ts">
 	import { CardInner, CardOuter, Link, LinksOuter } from "$lib/Card";
 	import members from "$lib/Team.json";
-	import IconDiscord from "~icons/simple-icons/discord";
-	import IconMatrix from "~icons/simple-icons/matrix";
-	import IconGitHub from "~icons/simple-icons/github";
-	import IconKey from "~icons/fa6-solid/key";
-	import IconGlobe from "~icons/fa6-solid/globe";
-	import IconEmail from "~icons/fa6-solid/envelope";
-	import IconCamera from "~icons/fa6-solid/camera";
 </script>
 
 <svelte:head>
@@ -22,43 +15,43 @@
 			<LinksOuter>
 				{#if matrix}
 					<Link url={matrix} classes="matrixcolored">
-						<IconMatrix />
+						<div class="i-simple-icons:matrix"></div>
 					</Link>
 				{/if}
 
 				{#if discord}
 					<Link url={discord} classes="discordcolored">
-						<IconDiscord />
+						<div class="i-simple-icons:discord"></div>
 					</Link>
 				{/if}
 
 				{#if github}
 					<Link url={github} classes="githubcolored">
-						<IconGitHub />
+						<div class="i-simple-icons:github"></div>
 					</Link>
 				{/if}
 
 				{#if website}
 					<Link url={website} classes="web">
-						<IconGlobe />
+						<div class="i-fa6-solid:globe"></div>
 					</Link>
 				{/if}
 
 				{#if email}
 					<Link url="mailto:{email}" classes="email">
-						<IconEmail />
+						<div class="i-fa6-solid:envelope"></div>
 					</Link>
 				{/if}
 
 				{#if pgp}
 					<Link url={pgp} classes="pgp">
-						<IconKey />
+						<div class="i-fa6-solid:key"></div>
 					</Link>
 				{/if}
 
 				{#if picture}
 					<Link url={picture} classes="picture">
-						<IconCamera />
+						<div class="i-fa6-solid:camera"></div>
 					</Link>
 				{/if}
 			</LinksOuter>
diff --git a/uno.config.ts b/uno.config.ts
new file mode 100644
index 0000000..dfecc53
--- /dev/null
+++ b/uno.config.ts
@@ -0,0 +1,14 @@
+import {
+	defineConfig,
+	presetIcons
+} from "unocss";
+
+import { extractorSvelte } from "unocss";
+
+export default defineConfig({
+	extractors: [extractorSvelte],
+
+	presets: [
+		presetIcons()
+	]
+});
\ No newline at end of file
diff --git a/vite.config.js b/vite.config.js
index 27f1475..dc355c8 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,14 +1,12 @@
 import { sveltekit } from "@sveltejs/kit/vite";
-import icons from "unplugin-icons/vite";
+import unoCSS from "unocss/vite";
+
 
 /** @type {import('vite').UserConfig} */
 const config = {
 	plugins: [
 		sveltekit(),
-
-		icons({
-			compiler: "svelte"
-		})
+		unoCSS()
 	]
 };