diff --git a/package.json b/package.json
index 535b905..cf05fb4 100644
--- a/package.json
+++ b/package.json
@@ -1,68 +1,67 @@
 {
-  "name": "boredgame",
-  "version": "0.0.2",
-  "scripts": {
-    "dev": "NODE_OPTIONS=\"--inspect\" vite dev --host",
-    "build": "vite build",
-    "package": "svelte-kit package",
-    "preview": "vite preview",
-    "test": "playwright test",
-    "check": "svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "prettier --check --plugin-search-dir=. . && eslint .",
-    "format": "prettier --write --plugin-search-dir=. ."
-  },
-  "devDependencies": {
-    "@iconify-icons/line-md": "^1.2.21",
-    "@iconify-icons/mdi": "^1.2.39",
-    "@iconify/svelte": "^3.0.1",
-    "@playwright/test": "^1.29.2",
-    "@rgossiaux/svelte-headlessui": "1.0.2",
-    "@rgossiaux/svelte-heroicons": "^0.1.2",
-    "@sveltejs/adapter-auto": "^1.0.0",
-    "@sveltejs/adapter-vercel": "^1.0.2",
-    "@sveltejs/kit": "^1.0.13",
-    "@types/cookie": "^0.5.1",
-    "@types/node": "^18.11.18",
-    "@typescript-eslint/eslint-plugin": "^5.48.1",
-    "@typescript-eslint/parser": "^5.48.1",
-    "autoprefixer": "^10.4.13",
-    "eslint": "^8.31.0",
-    "eslint-config-prettier": "^8.6.0",
-    "eslint-plugin-svelte3": "^4.0.0",
-    "just-clone": "^6.2.0",
-    "just-debounce-it": "^3.2.0",
-    "postcss": "^8.4.21",
-    "postcss-color-functional-notation": "^4.2.4",
-    "postcss-custom-media": "^9.0.1",
-    "postcss-env-function": "^4.0.6",
-    "postcss-import": "^15.1.0",
-    "postcss-load-config": "^4.0.1",
-    "postcss-media-minmax": "^5.0.0",
-    "postcss-nested": "^6.0.0",
-    "prettier": "^2.8.2",
-    "prettier-plugin-svelte": "^2.9.0",
-    "sass": "^1.57.1",
-    "svelte": "^3.55.1",
-    "svelte-check": "^2.10.3",
-    "svelte-preprocess": "^4.10.7",
-    "tslib": "^2.4.1",
-    "typescript": "^4.9.4",
-    "vite": "^4.0.4",
-    "vitest": "^0.25.3"
-  },
-  "type": "module",
-  "dependencies": {
-    "@fontsource/fira-mono": "^4.5.10",
-    "@leveluptuts/svelte-side-menu": "^1.0.5",
-    "@leveluptuts/svelte-toy": "^2.0.3",
-    "@lukeed/uuid": "^2.0.0",
-    "@types/feather-icons": "^4.29.1",
-    "cookie": "^0.5.0",
-    "feather-icons": "^4.29.0",
-    "iconify-icon": "^1.0.2",
-    "svelte-lazy-loader": "^1.0.0",
-    "zod": "^3.20.2",
-    "zod-to-json-schema": "^3.20.2"
-  }
-}
\ No newline at end of file
+	"name": "boredgame",
+	"version": "0.0.2",
+	"scripts": {
+		"dev": "NODE_OPTIONS=\"--inspect\" vite dev --host",
+		"build": "vite build",
+		"package": "svelte-kit package",
+		"preview": "vite preview",
+		"test": "playwright test",
+		"check": "svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
+		"lint": "prettier --check --plugin-search-dir=. . && eslint .",
+		"format": "prettier --write --plugin-search-dir=. ."
+	},
+	"devDependencies": {
+		"@iconify-icons/line-md": "^1.2.21",
+		"@iconify-icons/mdi": "^1.2.39",
+		"@playwright/test": "^1.29.2",
+		"@rgossiaux/svelte-headlessui": "1.0.2",
+		"@rgossiaux/svelte-heroicons": "^0.1.2",
+		"@sveltejs/adapter-auto": "^1.0.0",
+		"@sveltejs/adapter-vercel": "^1.0.2",
+		"@sveltejs/kit": "^1.0.13",
+		"@types/cookie": "^0.5.1",
+		"@types/node": "^18.11.18",
+		"@typescript-eslint/eslint-plugin": "^5.48.1",
+		"@typescript-eslint/parser": "^5.48.1",
+		"autoprefixer": "^10.4.13",
+		"eslint": "^8.31.0",
+		"eslint-config-prettier": "^8.6.0",
+		"eslint-plugin-svelte3": "^4.0.0",
+		"just-clone": "^6.2.0",
+		"just-debounce-it": "^3.2.0",
+		"postcss": "^8.4.21",
+		"postcss-color-functional-notation": "^4.2.4",
+		"postcss-custom-media": "^9.0.1",
+		"postcss-env-function": "^4.0.6",
+		"postcss-import": "^15.1.0",
+		"postcss-load-config": "^4.0.1",
+		"postcss-media-minmax": "^5.0.0",
+		"postcss-nested": "^6.0.0",
+		"prettier": "^2.8.2",
+		"prettier-plugin-svelte": "^2.9.0",
+		"sass": "^1.57.1",
+		"svelte": "^3.55.1",
+		"svelte-check": "^2.10.3",
+		"svelte-preprocess": "^4.10.7",
+		"tslib": "^2.4.1",
+		"typescript": "^4.9.4",
+		"vite": "^4.0.4",
+		"vitest": "^0.25.3"
+	},
+	"type": "module",
+	"dependencies": {
+		"@fontsource/fira-mono": "^4.5.10",
+		"@leveluptuts/svelte-side-menu": "^1.0.5",
+		"@leveluptuts/svelte-toy": "^2.0.3",
+		"@lukeed/uuid": "^2.0.0",
+		"@types/feather-icons": "^4.29.1",
+		"cookie": "^0.5.0",
+		"feather-icons": "^4.29.0",
+		"iconify-icon": "^1.0.2",
+		"svelte-lazy-loader": "^1.0.0",
+		"zod": "^3.20.2",
+		"zod-to-json-schema": "^3.20.2"
+	}
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index eeffcda..412b43a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,7 +4,6 @@ specifiers:
   '@fontsource/fira-mono': ^4.5.10
   '@iconify-icons/line-md': ^1.2.21
   '@iconify-icons/mdi': ^1.2.39
-  '@iconify/svelte': ^3.0.1
   '@leveluptuts/svelte-side-menu': ^1.0.5
   '@leveluptuts/svelte-toy': ^2.0.3
   '@lukeed/uuid': ^2.0.0
@@ -66,7 +65,6 @@ dependencies:
 devDependencies:
   '@iconify-icons/line-md': 1.2.21
   '@iconify-icons/mdi': 1.2.39
-  '@iconify/svelte': 3.0.1_svelte@3.55.1
   '@playwright/test': 1.29.2
   '@rgossiaux/svelte-headlessui': 1.0.2_svelte@3.55.1
   '@rgossiaux/svelte-heroicons': 0.1.2_svelte@3.55.1
@@ -380,15 +378,6 @@ packages:
       '@iconify/types': 2.0.0
     dev: true
 
-  /@iconify/svelte/3.0.1_svelte@3.55.1:
-    resolution: {integrity: sha512-onjjl496hTXUBWJxeCxo/c5zmVHS3HnKUQv5Cqf1ZsUbY4d0wVJfSDaV1hw1m6b0BNlJCOmbpc23Q6AOO5qqKg==}
-    peerDependencies:
-      svelte: '>=3'
-    dependencies:
-      '@iconify/types': 2.0.0
-      svelte: 3.55.1
-    dev: true
-
   /@iconify/types/2.0.0:
     resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
 
diff --git a/src/lib/components/game/index.svelte b/src/lib/components/game/index.svelte
index 13ba01b..847eabb 100644
--- a/src/lib/components/game/index.svelte
+++ b/src/lib/components/game/index.svelte
@@ -2,7 +2,6 @@
 	import { createEventDispatcher } from 'svelte';
 	import { Image } from 'svelte-lazy-loader';
 	import { fade } from 'svelte/transition';
-	import Icon from '@iconify/svelte/dist/OfflineIcon.svelte';
 	import plusCircle from '@iconify-icons/line-md/plus-circle';
 	import minusCircle from '@iconify-icons/line-md/minus-circle';
 	import Button from '$lib/components/button/index.svelte';
@@ -100,17 +99,17 @@
 		<Button size="md" kind={existsInCollection ? 'danger' : 'primary'} icon on:click={onCollectionClick}>
 			{collectionText}
 			{#if existsInCollection}
-				<Icon icon={minusCircle} width="24" height="24" />
+				<iconify-icon icon={minusCircle} width="24" height="24" />
 			{:else}
-				<Icon icon={plusCircle} width="24" height="24" />
+				<iconify-icon icon={plusCircle} width="24" height="24" />
 			{/if}
 		</Button>
 		<Button size="md" kind={existsInWishlist ? 'danger' : 'primary'} icon on:click={onWishlistClick}>
 			{wishlistText}
 			{#if existsInWishlist}
-				<Icon icon={minusCircle} width="24" height="24" />
+				<iconify-icon icon={minusCircle} width="24" height="24" />
 			{:else}
-				<Icon icon={plusCircle} width="24" height="24" />
+				<iconify-icon icon={plusCircle} width="24" height="24" />
 			{/if}
 		</Button>
 	</div>
diff --git a/src/lib/components/preferences/profile.svelte b/src/lib/components/preferences/profile.svelte
index b3a35f2..ec8cd6b 100644
--- a/src/lib/components/preferences/profile.svelte
+++ b/src/lib/components/preferences/profile.svelte
@@ -1,7 +1,6 @@
 <script lang="ts">
 	import { fade } from 'svelte/transition';
 	import { Popover, PopoverButton, PopoverPanel } from '@rgossiaux/svelte-headlessui';
-	import Icon from '@iconify/svelte/dist/OfflineIcon.svelte';
 	import cogOutline from '@iconify-icons/mdi/cog-outline';
 	import Themes from './themes.svelte';
 	import GameCollection from './gameCollection.svelte';
@@ -19,7 +18,7 @@
 					: 'transform: rotate(0deg); transition: transform 0.5s ease;'
 				}
 				></iconify-icon> -->
-			<Icon
+			<iconify-icon
 				icon={cogOutline}
 				width="24" height="24"
 				style={open ?
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index bdd81f2..6034a8b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -15,7 +15,7 @@
 	import { toast } from '$lib/components/toast/toast';
 	import Toast from '$lib/components/toast/Toast.svelte';
 	import '$root/styles/styles.pcss';
-	// import 'iconify-icon';
+	import 'iconify-icon';
 
 	import type { SavedGameType } from '$root/lib/types';
 
diff --git a/src/routes/game/[id]/+page.svelte b/src/routes/game/[id]/+page.svelte
index 686edef..3e4045d 100644
--- a/src/routes/game/[id]/+page.svelte
+++ b/src/routes/game/[id]/+page.svelte
@@ -1,7 +1,6 @@
 <script lang="ts">
 	import { fade, fly } from 'svelte/transition';
 	import { Image } from 'svelte-lazy-loader';
-	import Icon from '@iconify/svelte/dist/OfflineIcon.svelte';
 	import minusCircle from '@iconify-icons/line-md/minus-circle';
 	import plusCircle from '@iconify-icons/line-md/plus-circle';
 	import {
@@ -117,17 +116,17 @@
 		<Button size="md" kind={existsInCollection ? 'danger' : 'primary'} icon on:click={onCollectionClick}>
 			{collectionText}
 			{#if existsInCollection}
-				<Icon icon={minusCircle} width="24" height="24" />
+				<iconify-icon icon={minusCircle} width="24" height="24" />
 			{:else}
-				<Icon icon={plusCircle} width="24" height="24" />
+				<iconify-icon icon={plusCircle} width="24" height="24" />
 			{/if}
 		</Button>
 		<Button size="md" kind={existsInWishlist ? 'danger' : 'primary'} icon on:click={onWishlistClick}>
 			{wishlistText}
 			{#if existsInWishlist}
-				<Icon icon={minusCircle} width="24" height="24" />
+				<iconify-icon icon={minusCircle} width="24" height="24" />
 			{:else}
-				<Icon icon={plusCircle} width="24" height="24" />
+				<iconify-icon icon={plusCircle} width="24" height="24" />
 			{/if}
 		</Button>
 		</div>