diff --git a/src/components/addons/AddonCard.svelte b/src/components/addons/AddonCard.svelte
index e5a31d53..6395c245 100644
--- a/src/components/addons/AddonCard.svelte
+++ b/src/components/addons/AddonCard.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import { faStar, faXmark } from "@fortawesome/free-solid-svg-icons";
     import type { Addon, AddonTagArray, AddonTag } from "$interfaces/addons";
 	import { favoriteStore } from "$stores/AddonStore";
diff --git a/src/components/addons/AddonResults.svelte b/src/components/addons/AddonResults.svelte
index b9da204f..d91f467a 100644
--- a/src/components/addons/AddonResults.svelte
+++ b/src/components/addons/AddonResults.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import {
 		faSpinner
 	} from "@fortawesome/free-solid-svg-icons";
diff --git a/src/components/common/checkbox.svelte b/src/components/common/checkbox.svelte
index 9e7653cc..277d2843 100644
--- a/src/components/common/checkbox.svelte
+++ b/src/components/common/checkbox.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
     import { createEventDispatcher } from 'svelte';
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import {
 		faSquareCheck,
         faSquare
@@ -25,7 +25,7 @@
     .checkbox {
         color: white;
         position: relative;
-        
+
         & .click_zone {
             position: absolute;
             top: 0;
diff --git a/src/components/common/downloadButton.svelte b/src/components/common/downloadButton.svelte
index 40400d05..ba9c505b 100644
--- a/src/components/common/downloadButton.svelte
+++ b/src/components/common/downloadButton.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import { faFireFlameCurved, faEarthEurope, faWrench, faCube } from "@fortawesome/free-solid-svg-icons";
 	import { faGithub } from "@fortawesome/free-brands-svg-icons";
 
diff --git a/src/components/common/imagePreviewer.svelte b/src/components/common/imagePreviewer.svelte
index 9471e751..474e7036 100644
--- a/src/components/common/imagePreviewer.svelte
+++ b/src/components/common/imagePreviewer.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { onMount } from "svelte";
     import { fade, scale } from 'svelte/transition';
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import { faCaretLeft, faCaretRight, faTimes } from "@fortawesome/free-solid-svg-icons";
 
     type PreviewImage = {
@@ -22,7 +22,7 @@
     const imageList = Array.isArray(images) ? images : [images];
     const imageStringList = imageList.map((e) => ({...e, image: imageToString(e.image)}));
     const multiple = imageList.length > 1;
-    
+
     $: currentImagePreview = imageStringList[Math.min(Math.max(currentImageIndex, 0), imageList.length-1)];
     $: currentImageSrc = currentImagePreview.image;
     $: currentImageAlt = currentImagePreview.alt;
@@ -62,7 +62,7 @@
             behavior: 'smooth'
         })
     }
- 
+
     function handleKeyDown(keys: string|string[], action: Function): (e: KeyboardEvent) => void {
         let keyList: string[] = Array.isArray(keys) ? keys : [keys];
 
@@ -241,7 +241,7 @@
             max-width: 100%;
             max-height: 100%;
             display: block;
-            
+
             @include zoomin;
         }
     }
diff --git a/src/components/common/input.svelte b/src/components/common/input.svelte
index a13413f2..e7f6a60b 100644
--- a/src/components/common/input.svelte
+++ b/src/components/common/input.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
     import { createEventDispatcher } from 'svelte';
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import type { IconDefinition } from "@fortawesome/free-brands-svg-icons";
 	import { faXmark } from "@fortawesome/free-solid-svg-icons";
 
@@ -20,7 +20,7 @@
         if(value && clearable) class_arr.push('clearable')
         classes = class_arr.join(' ');
     }
-    
+
     const dispatch = createEventDispatcher();
     const clear = () => {
         value = '';
@@ -38,7 +38,7 @@
     <input use:typeAction {placeholder} bind:value on:keypress={onkeypress}>
     <span class="after">
         {#if clearable && value }
-            <span class="clear" role="button" tabindex="0" on:click={clear} on:keypress={() => {}}><Fa icon={faXmark} size="1.3x" /></span> 
+            <span class="clear" role="button" tabindex="0" on:click={clear} on:keypress={() => {}}><Fa icon={faXmark} size="1.3x" /></span>
         {/if}
         {#if appendIcon }
             <span class="append" role="button" tabindex="0" on:click={append} on:keypress={() => {}}><Fa icon={appendIcon} size="1.3x" /></span>
diff --git a/src/components/footer.svelte b/src/components/footer.svelte
index 5db5e0dc..d08c6647 100644
--- a/src/components/footer.svelte
+++ b/src/components/footer.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-import Fa from "svelte-fa/src/fa.svelte";
+import Fa from "svelte-fa";
 import { faGithub } from "@fortawesome/free-brands-svg-icons";
 import { t, locale, locales, loadTranslations} from '$lib/translations';
 import {
diff --git a/src/components/gallery/galleryTooltip.svelte b/src/components/gallery/galleryTooltip.svelte
index b54b25fd..75a80f60 100644
--- a/src/components/gallery/galleryTooltip.svelte
+++ b/src/components/gallery/galleryTooltip.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import Optional from "$lib/optional";
 	import contributionStore, { contributionAuthors } from "$stores/ContributionStore";
-	import Fa from "svelte-fa/src/fa.svelte";
+	import Fa from "svelte-fa";
 	import { faClock, faUser, faUsers, faWrench } from "@fortawesome/free-solid-svg-icons";
 	import Icon from "$components/common/icon.svelte";
 	import tooltip from "$lib/tooltip";
diff --git a/src/components/header.svelte b/src/components/header.svelte
index 12271638..5e75a73b 100644
--- a/src/components/header.svelte
+++ b/src/components/header.svelte
@@ -1,6 +1,6 @@
 <script>
 	import { t } from "$lib/translations";
-	import Fa from "svelte-fa/src/fa.svelte";
+	import Fa from "svelte-fa";
 	import {
 		faHouse,
 		faDownload,
diff --git a/src/components/home/packCard.svelte b/src/components/home/packCard.svelte
index 4212023a..486c0333 100644
--- a/src/components/home/packCard.svelte
+++ b/src/components/home/packCard.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
     import { faChevronRight } from "@fortawesome/free-solid-svg-icons";
 
     export let title: string;
diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte
index a5f49dd4..865d7254 100644
--- a/src/routes/about/+page.svelte
+++ b/src/routes/about/+page.svelte
@@ -1,5 +1,5 @@
 <script>
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import {
 		faAngleRight
 	} from "@fortawesome/free-solid-svg-icons";
diff --git a/src/routes/add-ons/[slug]/+page.svelte b/src/routes/add-ons/[slug]/+page.svelte
index 8ac5949e..3a97f253 100644
--- a/src/routes/add-ons/[slug]/+page.svelte
+++ b/src/routes/add-ons/[slug]/+page.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
     import {
         faGithub,
         faPatreon,
diff --git a/src/routes/downloads/downloadItem.svelte b/src/routes/downloads/downloadItem.svelte
index 27962235..09d37e47 100644
--- a/src/routes/downloads/downloadItem.svelte
+++ b/src/routes/downloads/downloadItem.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import DownloadLine from "./downloadLine.svelte";
-	import Fa from "svelte-fa/src/fa.svelte";
+	import Fa from "svelte-fa";
 	import { faPlus, faMinus } from "@fortawesome/free-solid-svg-icons";
 
 	export let version: string;
diff --git a/src/routes/downloads/downloadLine.svelte b/src/routes/downloads/downloadLine.svelte
index cb10471f..37fd3903 100644
--- a/src/routes/downloads/downloadLine.svelte
+++ b/src/routes/downloads/downloadLine.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import Fa from "svelte-fa/src/fa.svelte";
+	import Fa from "svelte-fa";
 	import { faGithub } from "@fortawesome/free-brands-svg-icons";
 	import { faFireFlameCurved } from "@fortawesome/free-solid-svg-icons";
 
diff --git a/src/routes/gallery/+page.svelte b/src/routes/gallery/+page.svelte
index 6716aa71..9e2dd7ef 100644
--- a/src/routes/gallery/+page.svelte
+++ b/src/routes/gallery/+page.svelte
@@ -6,7 +6,7 @@ import UrlStore from '$stores/UrlStore';
 import { settings } from '$stores/SettingStore';
 import { gallerySearch } from '$stores/GalleryStore';
 import GalleryOptions from '$components/gallery/galleryOptions.svelte';
-import Fa from "svelte-fa/src/fa.svelte";
+import Fa from "svelte-fa";
 import { faArrowUp } from '@fortawesome/free-solid-svg-icons';
 import GalleryTooltip from '$components/gallery/galleryTooltip.svelte';
 
diff --git a/src/routes/statistics/+page.svelte b/src/routes/statistics/+page.svelte
index 20eaf0a8..cea4bb49 100644
--- a/src/routes/statistics/+page.svelte
+++ b/src/routes/statistics/+page.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
 	import { faXmark } from "@fortawesome/free-solid-svg-icons";
     export let data: any;
     const TMP = data.data;
diff --git a/src/routes/team/TeamMemberCard.svelte b/src/routes/team/TeamMemberCard.svelte
index a9df208e..a39e552b 100644
--- a/src/routes/team/TeamMemberCard.svelte
+++ b/src/routes/team/TeamMemberCard.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { faGithub, faInstagram, faReddit, faSteam, faTwitter } from "@fortawesome/free-brands-svg-icons";
     import { faClock, faCode, faComment, faCube, faEye, faGavel, faGem, faLink, faLocationDot } from "@fortawesome/free-solid-svg-icons";
-    import Fa from "svelte-fa/src/fa.svelte";
+    import Fa from "svelte-fa";
     import tooltip from "$lib/tooltip";
     export let user: {
         color: string,