diff --git a/.gitignore b/.gitignore
index 58b66073..39279790 100644
--- a/.gitignore
+++ b/.gitignore
@@ -27,4 +27,7 @@ pnpm-debug.log*
 # TODO.md
 
 __pycache__
-dev-dist/*
\ No newline at end of file
+dev-dist/*
+
+# Local patches
+*.patch
\ No newline at end of file
diff --git a/package.json b/package.json
index 6054cd92..6d35986f 100644
--- a/package.json
+++ b/package.json
@@ -25,10 +25,12 @@
     "pinia": "^2.0.17",
     "pinia-plugin-persistedstate": "^3.2.0",
     "qr-code-styling": "^1.6.0-rc.1",
+    "universal-cookie": "^8.0.1",
     "v-wave": "^1.5.0",
     "vue": "^v3.5.13",
     "vue-boring-avatars": "^1.4.0",
     "vue-debounce": "^3.0.2",
+    "vue-i18n": "^11.4",
     "vue-router": "^4.1.3",
     "vue-template-compiler": "^2.0.0",
     "vue-virtual-scroller": "^2.0.0-beta.7",
diff --git a/src/components/AlbumView/AlbumDiscBar.vue b/src/components/AlbumView/AlbumDiscBar.vue
index 37a17698..90285c2c 100644
--- a/src/components/AlbumView/AlbumDiscBar.vue
+++ b/src/components/AlbumView/AlbumDiscBar.vue
@@ -1,9 +1,9 @@
 <template>
     <div v-if="album_disc.is_album_disc_number" class="album_disc_header no-select">
         <div class="disc_number">
-            Disc {{ album_disc.album_page_disc_number }}
+            {{ $t('AlbumView.DiskNumber', { num: album_disc.album_page_disc_number }) }}
             <span @click="$emit('playDisc', album_disc.album_page_disc_number || 0)" class="play">
-                <PlaySvg /> Play Disc {{ album_disc.album_page_disc_number }}</span
+                <PlaySvg /> {{ $t('AlbumView.PlayDisc') }} {{ album_disc.album_page_disc_number }}</span
             >
         </div>
         <div class="play"></div>
diff --git a/src/components/AlbumView/GenreBanner.vue b/src/components/AlbumView/GenreBanner.vue
index bdc42957..bad3e725 100644
--- a/src/components/AlbumView/GenreBanner.vue
+++ b/src/components/AlbumView/GenreBanner.vue
@@ -7,7 +7,7 @@
   >
     <div class="scrollable">
       <div class="rounded pad-sm genre-pill">
-        {{ genres.length ? "Genres" : "No genres" }}
+        {{ genres.length ? $t('AlbumView.GenreBanner.GenreExists') : $t('AlbumView.GenreBanner.GenreDoesNotExist') }}
       </div>
       <div
         v-for="genre in genres"
diff --git a/src/components/AlbumView/Header/Stats.vue b/src/components/AlbumView/Header/Stats.vue
index 42db3cb0..76892086 100644
--- a/src/components/AlbumView/Header/Stats.vue
+++ b/src/components/AlbumView/Header/Stats.vue
@@ -6,11 +6,11 @@
         :albumartists="''"
         :small="true"
         :append="!isSmallPhone ? statsText : ''"
-        :prepend="isSmallPhone ? 'Album by ' : ''"
+        :prepend="isSmallPhone ? $t('AlbumView.AlbumBy') : ''"
       />
     </div>
     <div v-if="isSmallPhone" class="stats2">
-      {{ new Date(album.date * 1000).getFullYear() }} {{ !album.is_single ? `• ${album.trackcount} Tracks` : "" }} •
+      {{ new Date(album.date * 1000).getFullYear() }} {{ !album.is_single ? `• ${album.trackcount} ${ $t('Common.Track', album.trackcount) }` : "" }} •
       {{ formatSeconds(album.duration, true) }}
     </div>
   </div>
@@ -18,6 +18,7 @@
 
 <script setup lang="ts">
 import { computed } from "vue";
+import { useT } from "@/i18n";
 
 import { Album } from "@/interfaces";
 import { isSmallPhone } from "@/stores/content-width";
@@ -25,6 +26,8 @@ import { formatSeconds } from "@/utils";
 
 import ArtistName from "@/components/shared/ArtistName.vue";
 
+const { t } = useT();
+
 const props = defineProps<{
   album: Album;
 }>();
@@ -34,7 +37,7 @@ const statsText = computed(() => {
 
   // hide track count if it's a single, also add an s to track if it's plural
   return `• ${new Date(props.album.date * 1000).getFullYear()} ${
-    !is_single ? `• ${props.album.trackcount.toLocaleString()} Track${props.album.trackcount > 1 ? "s" : ""}` : ""
+    !is_single ? `• ${props.album.trackcount.toLocaleString()} ${ t('Common.Track', props.album.trackcount) }` : ""
   } • ${formatSeconds(props.album.duration, true)}`;
 });
 </script>
diff --git a/src/components/ArtistView/AlbumsFetcher.vue b/src/components/ArtistView/AlbumsFetcher.vue
index 2a102ef6..5f13f6ec 100644
--- a/src/components/ArtistView/AlbumsFetcher.vue
+++ b/src/components/ArtistView/AlbumsFetcher.vue
@@ -1,6 +1,6 @@
 <template>
   <div style="height: 1px">
-    <button v-if="show_text" @click="fetch_callback">Load More</button>
+    <button v-if="show_text" @click="fetch_callback">{{ $t('ArtistView.LoadMore') }}</button>
   </div>
 </template>
 
diff --git a/src/components/ArtistView/HeaderComponents/Info.vue b/src/components/ArtistView/HeaderComponents/Info.vue
index 5ccdb8e7..a40d7de8 100644
--- a/src/components/ArtistView/HeaderComponents/Info.vue
+++ b/src/components/ArtistView/HeaderComponents/Info.vue
@@ -6,16 +6,16 @@
         }"
     >
         <section class="text">
-            <div class="card-title">Artist</div>
+            <div class="card-title">{{ $t('ArtistView.Title') }}</div>
             <div class="artist-name" :class="`${useCircularImage ? 'ellip' : 'ellip2'}`" :title="artist.name">
                 {{ artist.name }}
             </div>
             <div class="stats">
                 <span v-if="artist.trackcount">
-                    {{ artist.trackcount.toLocaleString() }} Track{{ `${artist.trackcount == 1 ? '' : 's'} • ` }}
+                    {{ artist.trackcount.toLocaleString() }} {{ `${ $t('Common.Track', artist.trackcount) } • `}}
                 </span>
                 <span v-if="artist.albumcount">
-                    {{ artist.albumcount.toLocaleString() }} Album{{ `${artist.albumcount == 1 ? '' : 's'} • ` }}
+                    {{ artist.albumcount.toLocaleString() }} {{ `${ $t('Common.Album', artist.albumcount) } • ` }}
                 </span>
                 <span v-if="artist.duration">
                     {{ `${formatSeconds(artist.duration, true)}` }}
diff --git a/src/components/ArtistView/TopTracks.vue b/src/components/ArtistView/TopTracks.vue
index b716ac6e..cb83f320 100644
--- a/src/components/ArtistView/TopTracks.vue
+++ b/src/components/ArtistView/TopTracks.vue
@@ -14,7 +14,7 @@
                 @playThis="playHandler(index)"
             />
         </div>
-        <div v-if="!tracks.length" class="error">No tracks</div>
+        <div v-if="!tracks.length" class="error">{{ $t('ArtistView.NoTracks') }}</div>
     </div>
 </template>
 
@@ -25,6 +25,7 @@ import { isMedium, isSmall } from '@/stores/content-width'
 import SeeAll from '../shared/SeeAll.vue'
 import SongItem from '../shared/SongItem.vue'
 
+
 defineProps<{
     tracks: Track[]
     route: string
diff --git a/src/components/BottomBar/Left.vue b/src/components/BottomBar/Left.vue
index baff4018..edaed96a 100644
--- a/src/components/BottomBar/Left.vue
+++ b/src/components/BottomBar/Left.vue
@@ -7,7 +7,7 @@
         />
         <RouterLink
             v-else
-            title="Go to Now Playing"
+            :title="$t('BottomBar.GoToNowPlaying')"
             :to="{
                 name: Routes.nowPlaying,
                 params: {
@@ -37,7 +37,7 @@
         >
             <div v-tooltip class="title">
                 <TextLoader
-                    :text="queue.currenttrack?.title || 'Hello there'"
+                    :text="queue.currenttrack?.title || $t('BottomBar.PlaceholderTitle') "
                     :duration="1000"
                     :fade-duration="1000"
                     :direction="queue.direction"
@@ -51,7 +51,7 @@
             </div>
             <ArtistName
                 :artists="queue.currenttrack?.artists || []"
-                :albumartists="queue.currenttrack?.albumartists || 'Welcome to Swing Music'"
+                :albumartists="queue.currenttrack?.albumartists || $t('BottomBar.PlaceholderArtist')""
                 class="artist"
             />
         </div>
diff --git a/src/components/BottomBar/Right.vue b/src/components/BottomBar/Right.vue
index 0adc19c6..4bb7bb5d 100644
--- a/src/components/BottomBar/Right.vue
+++ b/src/components/BottomBar/Right.vue
@@ -5,18 +5,18 @@
         <button
             class="repeat"
             :class="{ 'repeat-disabled': settings.repeat == 'none' }"
-            :title="settings.repeat == 'all' ? 'Repeat all' : settings.repeat == 'one' ? 'Repeat one' : 'No repeat'"
+            :title="settings.repeat == 'all' ? $t('BottomBar.RepeatOptions.All') : settings.repeat == 'one' ? $t('BottomBar.RepeatOptions.One') : $t('BottomBar.RepeatOptions.None')"
             @click="settings.toggleRepeatMode"
         >
             <RepeatOneSvg v-if="settings.repeat == 'one'" />
             <RepeatAllSvg v-else />
         </button>
-        <button class="shuffle" title="Shuffle" @click="queue.shuffleQueue">
+        <button class="shuffle" :title="$t('BottomBar.Shuffle')" @click="queue.shuffleQueue">
             <ShuffleSvg />
         </button>
         <HeartSvg
             v-if="!hideHeart"
-            title="Favorite"
+            :title="$t('BottomBar.Favorite')"
             :state="queue.currenttrack?.is_favorite"
             @handleFav="() => $emit('handleFav')"
         />
@@ -27,6 +27,7 @@
 import useQueue from '@/stores/queue'
 import useSettings from '@/stores/settings'
 
+
 import RepeatOneSvg from '@/assets/icons/repeat-one.svg'
 import RepeatAllSvg from '@/assets/icons/repeat.svg'
 import ShuffleSvg from '@/assets/icons/shuffle.svg'
diff --git a/src/components/CardListView/SortBanner.vue b/src/components/CardListView/SortBanner.vue
index 6e72e562..bfc3d0ba 100644
--- a/src/components/CardListView/SortBanner.vue
+++ b/src/components/CardListView/SortBanner.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="itemsortby">
-        <div class="tt select circular">Sort By</div>
+        <div class="tt select circular">{{ $t('CardList.SortBy') }}</div>
         <div class="left group">
             <SortKey
                 :items="($route.name == Routes.AlbumList ? albumitems : artistitems).concat(items)"
@@ -22,31 +22,34 @@ import { useRoute } from 'vue-router'
 import { useAlbumList, useArtistList } from '@/stores/pages/itemlist'
 import SortKey from './SortKey.vue'
 import ChartSvg from '@/assets/icons/chart.svg'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 const route = useRoute()
 const store = route.name === Routes.AlbumList ? useAlbumList() : useArtistList()
 
 const items = [
-    { key: 'trackcount', displayName: 'No. of tracks' },
-    { key: 'duration', displayName: 'Duration' },
-    { key: 'created_date', displayName: 'Date added' },
-    { key: 'lastplayed', displayName: 'Last played' },
+    { key: 'trackcount', displayName: t('CardList.SortByOptions.TrackCount') },
+    { key: 'duration', displayName: t('CardList.SortByOptions.Duration') },
+    { key: 'created_date', displayName: t('CardList.SortByOptions.CreatedDate') },
+    { key: 'lastplayed', displayName: t('CardList.SortByOptions.LastPlayed') },
 ]
 
 const statitems = [
-    { key: 'playcount', displayName: 'Plays' },
-    { key: 'playduration', displayName: 'Play duration' },
+    { key: 'playcount', displayName: t('CardList.SortByOptions.PlayCount') },
+    { key: 'playduration', displayName: t('CardList.SortByOptions.PlayDuration') },
 ]
 
 const albumitems = [
-    { key: 'title', displayName: 'Title' },
-    { key: 'albumartists', displayName: 'Artist' },
-    { key: 'date', displayName: 'Year released' },
+    { key: 'title', displayName: t('CardList.SortByOptions.Title') },
+    { key: 'albumartists', displayName: t('CardList.SortByOptions.AlbumArtists') },
+    { key: 'date', displayName: t('CardList.SortByOptions.Date') },
 ]
 
 const artistitems = [
-    { key: 'name', displayName: 'Name' },
-    { key: 'albumcount', displayName: 'No. of albums' },
+    { key: 'name', displayName: t('CardList.SortByOptions.Name') },
+    { key: 'albumcount', displayName: t('CardList.SortByOptions.NoOfAlbums') },
 ]
 </script>
 
diff --git a/src/components/Favorites/RecentsItemCard.vue b/src/components/Favorites/RecentsItemCard.vue
index d84e1f24..93b02d68 100644
--- a/src/components/Favorites/RecentsItemCard.vue
+++ b/src/components/Favorites/RecentsItemCard.vue
@@ -20,7 +20,7 @@
       {{ fav.type === "artist" ? fav.item.name : fav.item.title }}
     </div>
     <div class="label ellip" :class="{ on_artist: fav.type === 'artist' }">
-      {{ fav.type === "album" ? fav.item.artist : "Artist" }}
+      {{ fav.type === "album" ? fav.item.artist : $t('Favorites.Album')}}
     </div>
   </RouterLink>
 </template>
diff --git a/src/components/FolderView/FolderItem.vue b/src/components/FolderView/FolderItem.vue
index 2a00ac83..17fce7e7 100644
--- a/src/components/FolderView/FolderItem.vue
+++ b/src/components/FolderView/FolderItem.vue
@@ -17,7 +17,7 @@
       <div class="info">
         <div class="f-item-text ellip">{{ folder.name }}</div>
         <div class="f-count" v-if="folder.trackcount">
-          {{ folder.trackcount.toLocaleString() + ` File${folder.trackcount == 1 ? "" : "s"}` }}
+          {{ folder.trackcount.toLocaleString() + $t('FolderView.FileCount', folder.trackcount) }}
         </div>
       </div>
       <div v-if="!folder_page" class="check">
diff --git a/src/components/HomeView/Browse.vue b/src/components/HomeView/Browse.vue
index 43e097e1..16f40185 100644
--- a/src/components/HomeView/Browse.vue
+++ b/src/components/HomeView/Browse.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="homebrowse">
-    <div class="btitle"><b>Browse Library</b></div>
+    <div class="btitle"><b>{{ $t('HomeView.Browse.Title') }}</b></div>
     <div class="browselist">
       <RouterLink
         v-for="i in browselist"
@@ -34,10 +34,13 @@ import { triggerScan } from "@/requests/settings/rootdirs";
 import { Routes } from "@/router";
 import { album_card_with } from "@/stores/content-width";
 import useDialog from "@/stores/modal";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const browselist = [
   {
-    title: "Folders",
+    title: t('HomeView.Browse.BrowseList.Folders'),
     route: Routes.folder,
     params: {
       path: "$home",
@@ -45,46 +48,46 @@ const browselist = [
     icon: FolderIcon,
   },
   {
-    title: "Albums",
+    title: t('HomeView.Browse.BrowseList.Albums'),
     route: Routes.AlbumList,
     icon: AlbumIcon,
   },
   {
-    title: "Artists",
+    title: t('HomeView.Browse.BrowseList.Artists'),
     route: Routes.ArtistList,
     icon: ArtistIcon,
   },
   {
-    title: "Playlists",
+    title: t('HomeView.Browse.BrowseList.Playlists'),
     route: Routes.playlists,
     icon: PlaylistIcon,
   },
   {
-    title: "Favorites",
+    title: t('HomeView.Browse.BrowseList.Favorites'),
     route: Routes.favorites,
     icon: HeartIcon,
     class: "favorite",
   },
   {
-    title: "Fav. tracks",
+    title: t('HomeView.Browse.BrowseList.FavTracks'),
     route: Routes.favoriteTracks,
     icon: HeartIcon,
     class: "favorite",
   },
   {
-    title: "Fav. artists",
+    title: t('HomeView.Browse.BrowseList.FavArtists'),
     route: Routes.favoriteArtists,
     icon: ArtistIcon,
     class: "favorite",
   },
   {
-    title: "Fav. albums",
+    title: t('HomeView.Browse.BrowseList.FavAlbums'),
     route: Routes.favoriteAlbums,
     icon: AlbumIcon,
     class: "favorite",
   },
   // {
-  //   title: "Settings",
+  //   title: t('Common.Settings'),
   //   route: null,
   //   icon: SettingsIcon,
   //   action: () => {
@@ -93,7 +96,7 @@ const browselist = [
   //   class: "settings",
   // },
   {
-    title: "Stats",
+    title: t('HomeView.Browse.BrowseList.Stats'),
     icon: AlbumIcon,
     route: Routes.Stats,
   }
diff --git a/src/components/LeftSidebar/MobileNav.vue b/src/components/LeftSidebar/MobileNav.vue
index d5681f03..27132e75 100644
--- a/src/components/LeftSidebar/MobileNav.vue
+++ b/src/components/LeftSidebar/MobileNav.vue
@@ -33,5 +33,6 @@
 </template>
 
 <script setup lang="ts">
-import { menus } from "./navitems";
+import { useNavItems } from "../LeftSidebar/navitems";
+const { menus } = useNavItems();
 </script>
\ No newline at end of file
diff --git a/src/components/LeftSidebar/NP/Bitrate.vue b/src/components/LeftSidebar/NP/Bitrate.vue
index 14d09242..178be403 100644
--- a/src/components/LeftSidebar/NP/Bitrate.vue
+++ b/src/components/LeftSidebar/NP/Bitrate.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="q.currenttrack?.bitrate" class="bitrate" title="file type • bitrate">
+  <div v-if="q.currenttrack?.bitrate" class="bitrate" :title="$t('LeftSidebar.FileTypeBitrate')">
     {{ q.currenttrack.filepath?.split(".").pop() }} • {{ q.currenttrack.bitrate }}
   </div>
 </template>
diff --git a/src/components/LeftSidebar/NavButtons.vue b/src/components/LeftSidebar/NavButtons.vue
index 0c42517a..ecbcd277 100644
--- a/src/components/LeftSidebar/NavButtons.vue
+++ b/src/components/LeftSidebar/NavButtons.vue
@@ -25,7 +25,8 @@
 </template>
 
 <script setup lang="ts">
-import { menus } from "./navitems";
+import { useNavItems } from "../LeftSidebar/navitems";
+const { menus } = useNavItems();
 </script>
 
 <style lang="scss">
diff --git a/src/components/LeftSidebar/navitems.ts b/src/components/LeftSidebar/navitems.ts
index cd6116d5..2fd23912 100644
--- a/src/components/LeftSidebar/navitems.ts
+++ b/src/components/LeftSidebar/navitems.ts
@@ -8,58 +8,65 @@ import PlaylistSvg from "@/assets/icons/playlist-1.svg";
 import SearchSvg from "@/assets/icons/search.svg";
 import SettingsSvg from "@/assets/icons/settings.svg";
 import HomeSvg from "@/assets/icons/home.svg";
+import { useT } from "@/i18n";
 
-const folder = {
-  name: "folders",
-  route_name: Routes.folder,
-  params: { path: "$home" },
-  icon: FolderSvg,
-};
+export const useNavItems = () => {
+  const { t } = useT()
 
-const favorites = {
-  name: "favorites",
-  route_name: Routes.favorites,
-  icon: HeartSvg,
-};
+  const folder = {
+    name: t('LeftSidebar.NavItems.Folder'),
+    route_name: Routes.folder,
+    params: { path: "$home" },
+    icon: FolderSvg,
+  };
 
-const playlists = {
-  name: "playlists",
-  route_name: Routes.playlists,
-  icon: PlaylistSvg,
-};
+  const favorites = {
+    name: t('LeftSidebar.NavItems.Favorites'),
+    route_name: Routes.favorites,
+    icon: HeartSvg,
+  };
 
-const home = {
-  name: "home",
-  route_name: Routes.Home,
-  icon: HomeSvg,
-};
+  const playlists = {
+    name: t('LeftSidebar.NavItems.Playlists'),
+    route_name: Routes.playlists,
+    icon: PlaylistSvg,
+  };
 
-export const menus = [
-  home,
-  folder,
-  {
-    name: "search",
-    route_name: Routes.search,
-    params: { page: "top" },
-    query: () => ({ q: useSearch().query }),
-    icon: SearchSvg,
-  },
-  {
-    separator: true,
-  },
-  favorites,
-  playlists,
-  {
-    separator: true,
-  },
-  {
-    name: "settings",
-    route_name: null,
-    icon: SettingsSvg,
-    action: () => {
-      useDialog().showSettingsModal()
-    }
-  },
-];
+  const home = {
+    name: t('LeftSidebar.NavItems.Home'),
+    route_name: Routes.Home,
+    icon: HomeSvg,
+  };
 
-export const topnavitems = [home, folder, favorites, playlists];
+  const menus = [
+    home,
+    folder,
+    {
+      name: t('LeftSidebar.NavItems.Search'),
+      route_name: Routes.search,
+      params: { page: "top" },
+      query: () => ({ q: useSearch().query }),
+      icon: SearchSvg,
+    },
+    {
+      separator: true,
+    },
+    favorites,
+    playlists,
+    {
+      separator: true,
+    },
+    {
+      name: t('LeftSidebar.NavItems.Settings'),
+      route_name: null,
+      icon: SettingsSvg,
+      action: () => {
+        useDialog().showSettingsModal()
+      }
+    },
+  ];
+
+  const topnavitems = [home, folder, favorites, playlists];
+  
+  return { menus, topnavitems };
+};
\ No newline at end of file
diff --git a/src/components/Mixes/MixesHeader.vue b/src/components/Mixes/MixesHeader.vue
index 1a5ef231..124df58a 100644
--- a/src/components/Mixes/MixesHeader.vue
+++ b/src/components/Mixes/MixesHeader.vue
@@ -8,11 +8,11 @@
                 {{ mix.description }}
             </div>
             <div class="bunchofstuff">
-                {{ mix.trackcount }} track{{ mix.trackcount === 1 ? '' : 's' }} ▸ {{ mix.duration }}
+                {{ mix.trackcount }} {{ $t('Mixes.track', mix.trackcount) }} ▸ {{ mix.duration }}
             </div>
             <div class="buttons">
                 <PlayBtnRect :source="playSources.mix" :bg_color="'#fff'" @click.prevent="$emit('playThis')" />
-                <button class="savebtn" :title="mix.saved ? 'Saved Mix' : 'Save Mix'" @click="saveMix">
+                <button class="savebtn" :title="mix.saved ? $t('Mixes.SavedMix') : $t('Mixes.SaveMix')" @click="saveMix">
                     <SaveFilledSvg v-if="mix.saved" />
                     <SaveSvg v-else />
                 </button>
diff --git a/src/components/NowPlaying/Header.vue b/src/components/NowPlaying/Header.vue
index cf6f66b8..b6d3e931 100644
--- a/src/components/NowPlaying/Header.vue
+++ b/src/components/NowPlaying/Header.vue
@@ -13,7 +13,7 @@
                         albumhash: queue.currenttrack?.albumhash || ' ',
                     },
                 }"
-                title="Go to Album"
+                :title="$t('NowPlaying.GoToAlbum')"
                 class="np-image"
             >
                 <ImageLoader
@@ -37,7 +37,7 @@
             </div>
         </div>
         <!-- <TrackContext /> -->
-        <!-- <h3 v-if="queue.next" class="nowplaying_title">Up Next</h3>
+        <!-- <h3 v-if="queue.next" class="nowplaying_title">{{ $t('NowPlaying.UpNext') }}<</h3>
         <SongItem
             v-if="queue.next"
             :track="queue.next"
@@ -45,7 +45,7 @@
             :source="dropSources.folder"
             @play-this="queue.playNext"
         />
-        <h3 class="nowplaying_title">Queue</h3> -->
+        <h3 class="nowplaying_title">{{ $t('NowPlaying.Queue') }}<</h3> -->
     </div>
 </template>
 
diff --git a/src/components/NowPlaying/HomeScreen.vue b/src/components/NowPlaying/HomeScreen.vue
index 854a432c..a9009474 100644
--- a/src/components/NowPlaying/HomeScreen.vue
+++ b/src/components/NowPlaying/HomeScreen.vue
@@ -19,9 +19,12 @@ import updatePageTitle from '@/utils/updatePageTitle'
 
 import Header from '@/components/NowPlaying/Header.vue'
 import Queue from '@/components/RightSideBar/Queue.vue'
+import { useT } from '@/i18n'
 
+const { t } = useT()
 const store = useTracklist()
-onMounted(() => updatePageTitle('Now Playing'))
+
+onMounted(() => updatePageTitle(t('Common.NowPlaying')))
 </script>
 
 <style lang="scss">
diff --git a/src/components/NowPlaying/NowPlayingInfo.vue b/src/components/NowPlaying/NowPlayingInfo.vue
index 20d6a774..a206d1d9 100644
--- a/src/components/NowPlaying/NowPlayingInfo.vue
+++ b/src/components/NowPlaying/NowPlayingInfo.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="now-playing-info">
         <div class="text">
-            <div class="title">{{ queue.currenttrack?.title || 'Swing Music' }}</div>
+            <div class="title">{{ queue.currenttrack?.title || $t('Common.AppTitle') }}</div>
             <div class="artist">
                 <ArtistName
                     v-if="queue.currenttrack"
@@ -9,7 +9,7 @@
                     :albumartists="queue.currenttrack?.albumartists || ''"
                 />
                 <span v-else class="artist author">
-                    <a href="https://github.com/cwilvx" target="_blank">built by @cwilvx ↗</a>
+                    <a href="https://github.com/cwilvx" target="_blank">{{ $t('Common.BuiltBy')}}</a>
                 </span>
             </div>
         </div>
diff --git a/src/components/NowPlaying/PlayingFrom.vue b/src/components/NowPlaying/PlayingFrom.vue
index 1b4c5f4b..b369a110 100644
--- a/src/components/NowPlaying/PlayingFrom.vue
+++ b/src/components/NowPlaying/PlayingFrom.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="now-playing-top">
-        <router-link class="now-playling-from-link" :to="(data.location as RouteLocationRaw)" title="Go to Play Source">
+        <router-link class="now-playling-from-link" :to="(data.location as RouteLocationRaw)" :title="$t('NowPlaying.GoToPlaySource')">
             <div class="from">
                 <img
                     v-if="
diff --git a/src/components/Onboarding/Account.vue b/src/components/Onboarding/Account.vue
index 19f2419b..88f539de 100644
--- a/src/components/Onboarding/Account.vue
+++ b/src/components/Onboarding/Account.vue
@@ -3,18 +3,18 @@
         <form class="createadmin" @submit.prevent="createAccount">
             <Avatar class="avatar" :name="username" :size="48"/>
             <div>
-                <div class="heading">Create account</div>
-                <div class="description">This account will be used to manage your server.</div>
+                <div class="heading">{{ $t('Onboarding.CreateAccountTitle') }}</div>
+                <div class="description">{{ $t('Onboarding.CreateAccountDesc') }}</div>
             </div>
             <br />
             <div class="form">
                 <div class="names">
-                    <label for="username">Username</label>
+                    <label for="username">{{ $t('Common.Username') }}</label>
                     <Input :placeholder="username" input-id="username" required @input="input => (username = input)" />
                 </div>
                 <div class="passwords">
                     <div class="names">
-                        <label for="password">Password</label>
+                        <label for="password">{{ $t('Common.Password') }}</label>
                         <Input
                             :placeholder="password"
                             type="password"
@@ -24,7 +24,7 @@
                         />
                     </div>
                     <div class="names">
-                        <label for="confirmPassword">Confirm Password</label>
+                        <label for="confirmPassword">{{ $t('Common.ConfirmPass')}}</label>
                         <Input
                             :placeholder="confirmPassword"
                             type="password"
@@ -35,7 +35,7 @@
                     </div>
                 </div>
             </div>
-            <button class="btn-continue">Create account</button>
+            <button class="btn-continue">{{ $t('Common.CreateAccount' )}}</button>
         </form>
     </div>
 </template>
@@ -45,7 +45,9 @@ import { onMounted, ref } from 'vue'
 import { addNewUser } from '@/requests/auth'
 import Input from '@/components/shared/Input.vue'
 import Avatar from '@/components/shared/Avatar.vue'
+import { useT } from '@/i18n'
 
+const { t } = useT()
 const username = ref('')
 const password = ref('✶✶✶✶✶✶✶✶')
 const confirmPassword = ref('✶✶✶✶✶✶✶✶')
@@ -55,12 +57,12 @@ const emit = defineEmits(['accountCreated', 'error'])
 function validatePassword() {
     // check if password is at least 8 characters
     if (password.value.length < 8) {
-        return emit('error', 'Password must be at least 8 characters')
+        return emit('error', t('Onboarding.ErrorPassTooShort'))
     }
 
     // check if password and confirm password match
     if (password.value !== confirmPassword.value) {
-        return emit('error', 'Passwords do not match')
+        return emit('error', t('Onboarding.ErrorPassDoNotMatch'))
     }
 
     emit('error', '')
diff --git a/src/components/Onboarding/FilePicker.vue b/src/components/Onboarding/FilePicker.vue
index c25673ba..8db7dbdf 100644
--- a/src/components/Onboarding/FilePicker.vue
+++ b/src/components/Onboarding/FilePicker.vue
@@ -22,7 +22,7 @@
                         class="btn-finish"
                         @click="$emit('submitDirs', finalSelection.length ? finalSelection : [currentPath])"
                     >
-                        Continue
+                    {{ $t('Common.Continue') }}
                     </button></span
                 >
             </div>
@@ -51,9 +51,9 @@
         <div class="help rounded-sm">
             <div class="help-content">
                 <InfoSvg />
-                <span>Use (⌘/Ctrl or Shift) + Click to select multiple folders</span>
+                <span>{{ $t('Onboarding.FilePicker.Help')}}</span>
             </div>
-            <span>{{ selectedFolders.size }} Selected</span>
+            <span>{{ $t('Onboarding.FilePicker.Selected', {sel: selectedFolders.size}) }}</span>
         </div>
     </div>
 </template>
@@ -73,6 +73,9 @@ import ArrowLeftSvg from '@/assets/icons/arrow.svg'
 import InfoSvg from '@/assets/icons/info.svg'
 import { Folder } from '@/interfaces'
 import { createSubPaths } from '@/utils'
+import { useT } from '@/i18n.js'
+
+const { t } = useT()
 
 const props = defineProps<{
     userhome: string
@@ -93,7 +96,7 @@ const renderedFolders = computed(() => {
 
     if (first2.length >= 2) {
         first2[0].name = '↑'
-        first2[1].name = '. (this folder)'
+        first2[1].name = t('Onboarding.FilePicker.ThisFolderHelp')
     }
 
     return first2
diff --git a/src/components/Onboarding/Finish.vue b/src/components/Onboarding/Finish.vue
index a2bb6895..a7981283 100644
--- a/src/components/Onboarding/Finish.vue
+++ b/src/components/Onboarding/Finish.vue
@@ -1,12 +1,12 @@
 <template>
     <div class="onboardingfinish">
         <div class="heading">
-            <span v-if="isFinished">You're all set! 🎉</span>
-            <span v-else>You're almost there!</span>
+            <span v-if="isFinished">{{ $t('Onboarding.Finish.TitleDone') }}</span>
+            <span v-else>{{ $t('Onboarding.Finish.TitleAlmostDone') }}</span>
         </div>
         <div class="description">
-            <span v-if="isFinished">Click the button below to continue to your library.</span
-            ><span v-else>Swing Music is scanning your music folders. Please wait ...</span>
+            <span v-if="isFinished">{{ $t('Onboarding.Finish.ConfirmButton') }}</span
+            ><span v-else>{{ $t('Onboarding.Finish.Processing') }}</span>
         </div>
         <br />
         <div class="progress">
diff --git a/src/components/Onboarding/RootDirs.vue b/src/components/Onboarding/RootDirs.vue
index cf460264..9f0fc32b 100644
--- a/src/components/Onboarding/RootDirs.vue
+++ b/src/components/Onboarding/RootDirs.vue
@@ -1,15 +1,15 @@
 <template>
     <FilePicker v-if="showFilePicker" :userhome="userHome" @submitDirs="handleSubmitDirs" @cancel="toggleFilePicker" />
     <div v-else class="rootdirconfig">
-        <div class="heading">Configure music folders</div>
-        <div class="description">Where do you want Swing Music to look for music?</div>
+        <div class="heading">{{ $t('Onboarding.RootDirs.Title') }}</div>
+        <div class="description">{{ $t('Onboarding.RootDirs.TitleDesc') }}</div>
         <br />
         <div class="options">
             <div class="option" tabindex="0" @click="toggleHomeDir" @keydown="handleKeyDown($event, toggleHomeDir)">
                 <div>
-                    <div class="option-title">Home directory</div>
+                    <div class="option-title">{{ $t('Onboarding.RootDirs.HomeDir') }}</div>
                     <div class="option-description">
-                        Scan all folders in <span class="userhome">{{ userHome }}</span>
+                        {{ $t('Onboarding.RootDirs.HomeDirDesc') }} <span class="userhome">{{ userHome }}</span>
                     </div>
                 </div>
                 <div class="option-selected">
@@ -24,28 +24,28 @@
                 @keydown="handleKeyDown($event, toggleFilePicker)"
             >
                 <div>
-                    <div class="option-title">Specific directory</div>
+                    <div class="option-title"> {{ $t('Onboarding.RootDirs.SpecificFolder') }}</div>
                     <div class="option-description">
                         {{
                             specificDirsSelected
-                                ? `${finalRootDirs.length} folder${finalRootDirs.length !== 1 ? 's' : ''} selected`
-                                : 'Select folder to scan for music'
+                                ? t('Onboarding.RootDirs.FolderSelected', {n: finalRootDirs.length}, finalRootDirs.length)
+                                : t('Onboarding.RootDirs.FolderSelectedDesc')
                         }}
                     </div>
                 </div>
                 <div v-show="specificDirsSelected" class="option-selected">
-                    <span>Add Folders</span>
+                    <span>{{ $t('Onboarding.RootDirs.AddFolders') }}</span>
                     <CheckSvg v-if="specificDirsSelected" height="1.75rem" />
                 </div>
             </div>
         </div>
         <br />
         <div class="btn-container">
-            <button class="btn-continue" @click="handleContinue">{{ fromSettings ? 'Update' : 'Continue' }}</button>
+            <button class="btn-continue" @click="handleContinue">{{ fromSettings ? $t('Common.Update') : $t('Common.Continue') }}</button>
         </div>
     </div>
     <div v-if="rootDirs.length > 0 && !homeDirSelected" class="selected-folders rounded-sm">
-        <div class="heading">{{ finalRootDirs.length }} selected folders</div>
+        <div class="heading">{{ t('Onboarding.RootDirs.FolderSelected', {n: finalRootDirs.length}, finalRootDirs.length) }}</div>
         <div class="folders">
             <div v-for="folder in finalRootDirs" :key="folder" class="folder">
                 <FolderSvg />
@@ -77,6 +77,9 @@ import FilePicker from './FilePicker.vue'
 import FolderSvg from '@/assets/icons/folder.svg'
 import SubtractSvg from '@/assets/icons/subtract.svg'
 import CheckSvg from '@/assets/icons/check.filled.svg'
+import { useT } from '@/i18n.js'
+
+const { t } = useT()
 
 // SECTION: Props & Emits
 const props = defineProps<{
@@ -166,7 +169,7 @@ function handleRemoveFolder(folder: string) {
 
 async function handleContinue() {
     if (!rootDirs.value.length) {
-        emit('error', 'Please select a root directory')
+        emit('error', t('Onboarding.RootDirs.ErrorSelectRootFolder'))
         return
     }
 
diff --git a/src/components/Onboarding/Welcome.vue b/src/components/Onboarding/Welcome.vue
index aaf4aa14..0ff56ee2 100644
--- a/src/components/Onboarding/Welcome.vue
+++ b/src/components/Onboarding/Welcome.vue
@@ -1,13 +1,13 @@
 <template>
     <div class="welcome">
         <div class="logo"><LogoSvg /></div>
-        <div class="heading">Welcome to</div>
-        <div class="appname">Swing Music</div>
+        <div class="heading">{{ $t('Onboarding.Welcome.Title') }}</div>
+        <div class="appname">{{ $t('Common.AppTitle') }}</div>
         <p class="tagline">
-            Click the button below to let's create your account <br />
+            {{ $t('Onboarding.Welcome.Tagline') }}<br />
             <!-- and configure your music folders to get started. -->
         </p>
-        <button class="btn-continue" tabindex="0" @click="emit('continue')">Get Started</button>
+        <button class="btn-continue" tabindex="0" @click="emit('continue')">{{ $t('Onboarding.Welcome.GetStarted') }}</button>
     </div>
 </template>
 
diff --git a/src/components/PlaylistView/AfterHeader.vue b/src/components/PlaylistView/AfterHeader.vue
index 64df2178..305d75fa 100644
--- a/src/components/PlaylistView/AfterHeader.vue
+++ b/src/components/PlaylistView/AfterHeader.vue
@@ -1,9 +1,8 @@
 <template>
     <div class="p-after-header">
-        <div>All Tracks</div>
+        <div>{{ $t('PlaylistView.AllTracks') }}</div>
     </div>
 </template>
-
 <style lang="scss">
 .isSmall .p-after-header {
     padding-left: 0.5rem;
diff --git a/src/components/PlaylistView/Header/Info.vue b/src/components/PlaylistView/Header/Info.vue
index 92cd03a8..dd448ac7 100644
--- a/src/components/PlaylistView/Header/Info.vue
+++ b/src/components/PlaylistView/Header/Info.vue
@@ -9,7 +9,7 @@
       <PlayBtnRect :source="playSources.playlist" :bg_color="btn_color" />
     </div>
     <div class="duration">
-      {{ playlist.info.count.toLocaleString() + ` ${playlist.info.count == 1 ? "Track" : "Tracks"}` }}
+      {{ playlist.info.count.toLocaleString() + $t('Common.Track', playlist.info.count) }}
       •
       {{ formatSeconds(playlist.info.duration, true) }}
     </div>
@@ -20,7 +20,7 @@
         <br />
       </span>
     </div>
-    <div class="type">Playlist</div>
+    <div class="type">{{ $t('Common.Playlist') }}</div>
   </div>
 </template>
 <script setup lang="ts">
diff --git a/src/components/PlaylistView/Header/LastUpdated.vue b/src/components/PlaylistView/Header/LastUpdated.vue
index c0240bf7..06ceea82 100644
--- a/src/components/PlaylistView/Header/LastUpdated.vue
+++ b/src/components/PlaylistView/Header/LastUpdated.vue
@@ -1,8 +1,8 @@
 <template>
     <div class="last-updated">
-        <span v-if="!isHeaderSmall" class="status">Last updated {{ playlist.info._last_updated }}</span>
+        <span v-if="!isHeaderSmall" class="status">{{ $t('PlaylistView.LastUpdated', { date: playlist.info._last_updated }) }}</span>
         <div v-if="Number.isInteger(playlist.info.id)" class="edit">
-            &#160;&#160;|&#160;&#160; <span @click="editPlaylist">Edit</span>&#160;&#160;
+            &#160;&#160;|&#160;&#160; <span @click="editPlaylist">{{ $t('PlaylistView.Edit') }}</span>&#160;&#160;
             {{ Number.isInteger(playlist.info.id) ? ' | ' : '' }}
             <DeleteSvg class="edit" @click="deletePlaylist" />
         </div>
diff --git a/src/components/PlaylistsList/PlaylistCard.vue b/src/components/PlaylistsList/PlaylistCard.vue
index 39365190..02e6e616 100644
--- a/src/components/PlaylistsList/PlaylistCard.vue
+++ b/src/components/PlaylistsList/PlaylistCard.vue
@@ -15,7 +15,7 @@
       </div>
       <div class="p-name ellip">{{ playlist.name }}</div>
       <div class="p-count">
-        <b>{{ playlist.count.toLocaleString() + ` Track${playlist.count === 1 ? "" : "s"}` }}</b>
+        <b>{{ playlist.count.toLocaleString() + $t('Common.Track', playlist.count) }}</b>
       </div>
     </div>
   </router-link>
diff --git a/src/components/RightSideBar/Home/Recommendation.vue b/src/components/RightSideBar/Home/Recommendation.vue
index c2fe2905..ed140aca 100644
--- a/src/components/RightSideBar/Home/Recommendation.vue
+++ b/src/components/RightSideBar/Home/Recommendation.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="r-tracks rounded bg-primary">
-    <div class="heading">Similar tracks</div>
+    <div class="heading">{{ $t('RightSidebar.SimilarTracks') }}</div>
     <div class="tracks">
       <div v-for="song in songs" :key="song.artist" class="song-item">
         <img src="" class="rounded" loading="lazy"/>
diff --git a/src/components/RightSideBar/Queue.vue b/src/components/RightSideBar/Queue.vue
index 621d5b3f..de528288 100644
--- a/src/components/RightSideBar/Queue.vue
+++ b/src/components/RightSideBar/Queue.vue
@@ -4,8 +4,8 @@
     <div class="queue-virtual-scroller" @mouseover="mouseover = true" @mouseout="mouseover = false">
         <NoItems
             :flag="!store.tracklist.length"
-            :title="'No songs in queue'"
-            :description="'When you start playing songs, they will appear here.'"
+            :title="$t('RightSidebar.NoQueueTitle')"
+            :description="$t('RightSidebar.NoQueueDescription')"
             :icon="QueueSvg"
         />
         <RecycleScroller
@@ -42,6 +42,7 @@ import TrackItem from '@/components/shared/TrackItem.vue'
 import QueueSvg from '@/assets/icons/queue.svg'
 import PlayingFrom from '../NowPlaying/PlayingFrom.vue'
 
+
 const itemHeight = 64
 const paddingTop = 16
 
diff --git a/src/components/RightSideBar/Queue/QueueActions.vue b/src/components/RightSideBar/Queue/QueueActions.vue
index 7981e122..6ba02dc5 100644
--- a/src/components/RightSideBar/Queue/QueueActions.vue
+++ b/src/components/RightSideBar/Queue/QueueActions.vue
@@ -3,9 +3,9 @@
     <!-- <div class="left"> -->
       <!-- <button v-if="!onNowPlaying" v-wave class="shuffle-queue action" @click="queue.shuffleQueue">
         <ShuffleSvg />
-        <span>Shuffle</span>
+      <span>{{ $t('RightSidebar.Shuffle') }}<</span>
       </button>
-      <h2 v-else style="margin: 0">Now Playing</h2> -->
+      <h2 v-else style="margin: 0">{{ $t('RightSidebar.NowPlaying') }}</h2> -->
       <PlayingFrom />
     <!-- </div>
     <div class="right">
diff --git a/src/components/RightSideBar/Queue/upNext.vue b/src/components/RightSideBar/Queue/upNext.vue
index 276cf401..134c9002 100644
--- a/src/components/RightSideBar/Queue/upNext.vue
+++ b/src/components/RightSideBar/Queue/upNext.vue
@@ -1,13 +1,13 @@
 <template>
   <div class="bottom-left">
-    <div class="upNext rounded-sm border" title="play next song">
+    <div class="upNext rounded-sm border" title="{{ $t('UpNext.PlayNextSong') }}">
       <img
         :src="paths.images.thumb.small + queue.next?.image"
         class="rounded-sm"
       />
       <div class="text">
         <div class="title"><b>Stiff necked fools</b></div>
-        <div class="from">Next up</div>
+        <div class="from">{{ $t('UpNext.NextUp') }}</div>
       </div>
     </div>
   </div>
@@ -19,6 +19,7 @@ import useQueueStore from "@/stores/queue";
 
 import { ref } from "vue";
 
+
 const context_on = ref(false);
 const queue = useQueueStore();
 </script>
diff --git a/src/components/RightSideBar/Search/Main.vue b/src/components/RightSideBar/Search/Main.vue
index 1e473b32..bd703e57 100644
--- a/src/components/RightSideBar/Search/Main.vue
+++ b/src/components/RightSideBar/Search/Main.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="right-search">
     <TabsWrapper :tabs="tabs" :current-tab="currentTab" :tab-content="true" @switchTab="switchTab">
-      <Tab :name="currentTab" />
+      <Tab :name=currentTab />
     </TabsWrapper>
   </div>
 </template>
@@ -13,6 +13,7 @@ import useSearchStore from "@/stores/search";
 import Tab from "./Tab.vue";
 import TabsWrapper from "./TabsWrapper.vue";
 
+
 const search = useSearchStore();
 
 const tabs = ["top", "tracks", "albums", "artists"];
@@ -23,6 +24,7 @@ function switchTab(tab: string) {
   currentTab.value = tab;
   search.switchTab(tab);
 }
+
 </script>
 
 <style lang="scss">
diff --git a/src/components/RightSideBar/Search/TabsWrapper.vue b/src/components/RightSideBar/Search/TabsWrapper.vue
index af18dfc4..ad1b5f1c 100644
--- a/src/components/RightSideBar/Search/TabsWrapper.vue
+++ b/src/components/RightSideBar/Search/TabsWrapper.vue
@@ -8,7 +8,7 @@
                 :class="{ activetab: tab === currentTab }"
                 @click="$emit('switchTab', tab)"
             >
-                {{ tab }}
+                {{ resolveButtonTabName(tab) }}
             </button>
         </div>
 
@@ -19,6 +19,25 @@
 </template>
 
 <script setup lang="ts">
+
+import { useT } from '@/i18n';
+
+const { t } = useT();
+
+function resolveButtonTabName(id: string): string {
+    switch (id){
+        case 'top':
+            return t('Search.top');
+        case 'tracks':
+            return t('Common.Track', 2);
+        case 'albums':
+            return t('Common.Album', 2);
+        case 'artists':
+            return t('Common.Artist', 2);
+        default:
+            return id;
+    }
+}
 defineProps<{
     tabs: string[]
     currentTab: string
diff --git a/src/components/RightSideBar/Search/Top/TopItem.vue b/src/components/RightSideBar/Search/Top/TopItem.vue
index a2d9c90b..7d01fe30 100644
--- a/src/components/RightSideBar/Search/Top/TopItem.vue
+++ b/src/components/RightSideBar/Search/Top/TopItem.vue
@@ -26,9 +26,9 @@
                 </div>
                 <div v-if="res_type === 'artist'" class="artists flex">
                     {{ item.albumcount }}
-                    {{ item.albumcount === 1 ? 'album' : 'albums' }} •
+                    {{ $t('Common.album', item.albumcount) }} •
                     {{ item.trackcount }}
-                    {{ item.trackcount === 1 ? 'track' : 'tracks' }}
+                    {{ $t('Common.track', item.trackcount) }}
                 </div>
                 <div v-if="res_type === 'track'" class="artists flex">
                     <ArtistName :artists="item.artists" :albumartists="item.albumartists" />
diff --git a/src/components/RightSideBar/Search/TopResults.vue b/src/components/RightSideBar/Search/TopResults.vue
index 7aca50d6..e7ee4ed2 100644
--- a/src/components/RightSideBar/Search/TopResults.vue
+++ b/src/components/RightSideBar/Search/TopResults.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="right-top-results">
     <NoItems
-      :title="'No results'"
-      :description="'We can\'t find any results for your search.'"
+      :title="$t('Search.NoResultsTitle')"
+      :description="$t('Search.NoResultsDescription')"
       :icon="SearchSvg"
       :flag="
         !search.top_results.top_result || !search.top_results.top_result.type
@@ -11,19 +11,19 @@
     <div
       v-if="search.top_results.top_result && search.top_results.top_result.type"
     >
-      <h3 class="h3">Top Result</h3>
+      <h3 class="h3">{{ $t('Search.TopResult') }}</h3>
       <TopItem />
     </div>
     <div v-if="search.top_results.tracks.length">
-      <h3 class="h3">Tracks</h3>
+      <h3 class="h3">{{ $t('Common.Track', 2) }}</h3>
       <TopTracks />
     </div>
     <div v-if="search.top_results.artists.length">
-      <h3 class="h3">Artists</h3>
+      <h3 class="h3">{{ $t('Common.Artist', 2) }}</h3>
       <TopArtists />
     </div>
     <div v-if="search.top_results.albums.length">
-      <h3 class="h3">Albums</h3>
+      <h3 class="h3">{{ $t('Common.Album', 2) }}</h3>
       <TopAlbums />
     </div>
   </div>
diff --git a/src/components/RightSideBar/Search/TracksGrid.vue b/src/components/RightSideBar/Search/TracksGrid.vue
index 15aef413..edcbbc76 100644
--- a/src/components/RightSideBar/Search/TracksGrid.vue
+++ b/src/components/RightSideBar/Search/TracksGrid.vue
@@ -1,7 +1,7 @@
 <template>
   <div id="tracks-results">
     <div v-if="!search.tracks.value.length" class="t-center">
-      <h5>No tracks</h5>
+      <h5>{{ $t('Search.NoTracksTitle') }}</h5>
     </div>
 
     <RecycleScroller
diff --git a/src/components/RightSideBar/SearchInput.vue b/src/components/RightSideBar/SearchInput.vue
index 996b7f1b..a9fa371d 100644
--- a/src/components/RightSideBar/SearchInput.vue
+++ b/src/components/RightSideBar/SearchInput.vue
@@ -14,7 +14,7 @@
         <div id="ginner" ref="inputRef" tabindex="0">
             <button
                 v-auto-animate
-                :title="tabs.current === tabs.tabs.search ? 'back to queue' : 'go to search'"
+                :title="tabs.current === tabs.tabs.search ? $t('SearchInput.BackToQueue') : $t('SearchInput.GoToSearch')"
                 :class="{ no_bg: on_nav }"
                 @click.prevent="handleButton"
             >
@@ -24,7 +24,7 @@
             <input
                 id="globalsearch"
                 v-model.trim="search.query"
-                placeholder="Start typing to search"
+                :placeholder="$t('Search.SearchPlaceholder')"
                 type="search"
                 autocomplete="off"
                 spellcheck="false"
diff --git a/src/components/SettingsView/About.vue b/src/components/SettingsView/About.vue
index 05b82012..a3353b00 100644
--- a/src/components/SettingsView/About.vue
+++ b/src/components/SettingsView/About.vue
@@ -1,53 +1,45 @@
 <template>
     <div class="aboutswingmusic">
         <div class="version">Swing Music v{{ settings.version }}</div>
-        Swing Music is a labor of love developed by
-        <a
-            href="https://github.com/cwilvx"
-            target="_blank"
-            >@<u>cwilvx</u></a
-        >
-        on GitHub. If you like this software, a star on GitHub would be nice.
-        Hope you enjoy using it as much as I enjoy building it. 😁🤗
+        <span v-html="$t('Settings.About.Developer', { link: '<a href=&quot;https://github.com/cwilvx&quot; target=&quot;_blank&quot;>@<u>cwilvx</u></a>' })"></span>
         <br /><br />
         <div class="links">
-            <h2>Links</h2>
+            <h2>{{ $t('Settings.About.LinksTitle') }}</h2>
             <div class="flex">
                 <a
                     href="https://swingmusic.vercel.app/guide/introduction.html"
                     target="_blank"
-                    ><button>Docs</button></a
+                    ><button>{{ $t('Settings.About.LinksDocs') }}</button></a
                 >
                 <a
                     href="https://github.com/cwilvx/swingmusic"
                     target="_blank"
-                    ><button>Star on Github</button></a
+                    ><button>{{ $t('Settings.About.LinksGitHub') }}</button></a
                 >
                 <a
                     href="https://github.com/cwilvx/swingmusic/issues/new/choose"
                     target="_blank"
                 >
-                    <button>Report issue</button>
+                    <button>{{ $t('Settings.About.LinksIssue') }}</button>
                 </a>
                 <a
                     href="https://github.com/cwilvx/swingmusic/blob/master/.github/contributing.md"
                     target="_blank"
-                    ><button>Contribute</button></a
+                    ><button>{{ $t('Settings.About.LinksContribute') }}</button></a
                 >
             </div>
         </div>
         <br />
         <div class="contact">
-            <h2>Get in touch</h2>
-            If you like my work, and would like to say hi, I'd like to hear from
-            you.
+            <h2>{{ $t('Settings.About.GetInTouchTitle') }}</h2>
+            {{ $t('Settings.About.GetInTouchDescription') }}
             <br /><br />
             <div class="flex">
                 <a
                     href="mailto:geoffreymungai45@gmail.com?subject=Hiii 👋😁&body=Hi Mungai,
         "
                     target="_blank"
-                    ><button>Send email</button></a
+                    ><button>{{ $t('Settings.About.SendEmail') }}</button></a
                 >
             </div>
         </div>
diff --git a/src/components/SettingsView/Components/BackupRestore.vue b/src/components/SettingsView/Components/BackupRestore.vue
index 25b860ad..21350688 100644
--- a/src/components/SettingsView/Components/BackupRestore.vue
+++ b/src/components/SettingsView/Components/BackupRestore.vue
@@ -1,10 +1,10 @@
 <template>
     <div class="backup-restore">
-        <button class="backupnow" @click="doBackup">Backup</button>
+        <button class="backupnow" @click="doBackup">{{ $t('Settings.Backup.Title') }}</button>
         <div class="separator"></div>
-        <h4>Restore backup</h4>
+        <h4>{{ $t('Settings.Backup.RestoreBackup') }}</h4>
         <div class="helptext">
-            You have {{ backups.length }} backup{{ backups.length !== 1 ? 's' : '' }} in your backup directory.
+            {{ $t('Settings.Backup.BackupCount', { count: backups.length }) }}
         </div>
         <div></div>
         <br />
@@ -22,11 +22,11 @@
                 </div>
                 <div class="buttons">
                     <DeleteSvg @click="() => deleteBackup(backup.name)" />
-                    <button class="restore" @click="() => restore(backup.name)">Restore</button>
+                    <button class="restore" @click="() => restore(backup.name)">{{ $t('Settings.Backup.RestoreButton') }}<</button>
                 </div>
             </div>
         </div>
-        <button class="restore-all" @click="() => restore()">Restore All</button>
+        <button class="restore-all" @click="() => restore()">{{ $t('Settings.Backup.RestoreAllButton') }}<</button>
     </div>
 </template>
 
@@ -35,7 +35,9 @@ import { backupNow, getBackups, restoreBackup, deleteBackup as deleteBackupReq }
 import { onMounted, ref } from 'vue'
 import { useToast } from '@/stores/notification'
 import DeleteSvg from '@/assets/icons/delete.svg'
-import { pruralize } from '@/utils'
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const toast = useToast()
 
@@ -57,7 +59,7 @@ async function doBackup() {
     const res = await backupNow()
 
     if (res.status === 200) {
-        toast.showSuccess('Backup created')
+        toast.showSuccess(t('Settings.Backup.BackupSuccess'))
         backups.value.unshift(res.data)
     } else {
         toast.showError(res.data.msg)
@@ -90,21 +92,21 @@ function getBackupStatsString(backup: Backup): string {
     const separator = '\u00A0•\u00A0'
 
     if (backup.playlists > 0) {
-        parts.push(`${backup.playlists} ${pruralize('playlist', backup.playlists)}`)
+        parts.push(t('Settings.Backup.PlaylistCount', { count: backup.playlists }, backup.playlists))
     }
 
     if (backup.playlists > 0 && backup.scrobbles > 0) {
         parts.push(separator)
     }
 
-    parts.push(`${backup.scrobbles} ${pruralize('scrobble', backup.scrobbles)}`)
+    parts.push(t('Settings.Backup.ScrobbleCount', { count: backup.scrobbles }, backup.scrobbles))
 
     if (backup.scrobbles + backup.playlists > 0 && backup.favorites > 0) {
         parts.push(separator)
     }
 
     if (backup.favorites > 0) {
-        parts.push(`${backup.favorites} ${pruralize('favorite', backup.favorites)}`)
+        parts.push(t('Settings.Backup.FavoriteCount', { count: backup.favorites }, backup.favorites))
     }
 
     if (backup.scrobbles + backup.playlists + backup.favorites > 0 && backup.collections > 0) {
@@ -112,7 +114,7 @@ function getBackupStatsString(backup: Backup): string {
     }
 
     if (backup.collections > 0) {
-        parts.push(`${backup.collections} ${pruralize('collection', backup.collections)}`)
+        parts.push(t('Settings.Backup.CollectionCount', { count: backup.collections }, backup.collections))
     }
 
     return parts.join(' ')
diff --git a/src/components/SettingsView/Components/License.vue b/src/components/SettingsView/Components/License.vue
index 0f3f6b82..566c6304 100644
--- a/src/components/SettingsView/Components/License.vue
+++ b/src/components/SettingsView/Components/License.vue
@@ -8,17 +8,18 @@
             <div class="info">
                 <div class="header">
                     <b
-                        ><span v-if="!licenseInfo">GitHub Sponsor Benefits</span
-                        ><span v-else>Thank you for sponsoring Swing Music!</span></b
+                        ><span v-if="!licenseInfo">{{ $t('Settings.License.GithubSponsorTitle') }}</span
+                        ><span v-else>{{ $t('Settings.Backup.ThankYouMessage') }}</span></b
                     >
                 </div>
                 <div class="desc">
                     <span v-if="!licenseInfo">
-                        Swing Music Premium is available to all our GitHub Sponsors. Log in with GitHub to get access.
+                        {{ $t('Settings.License.NoGithubLogin') }}
+                        
                     </span>
                     <span v-else>
-                        Hello @{{ licenseInfo.customer.name }}! You have access to Swing Music Premium. <br />
-                        Thank you for your support. ❤️❤️</span
+                        {{ $t('Settings.License.ThanksCustName', {cust: licenseInfo.customer.name}) }}<br />
+                        {{ $t('Settings.License.ThanksWithHearts') }}</span
                     >
 
                     <!-- <br /><br /> -->
@@ -27,11 +28,11 @@
                 <div v-if="!licenseInfo" class="btns">
                     <button @click="loginWithGitHub">{{ loginWithGitHubText }}</button>
                     <a
-                        v-if="loginWithGitHubText === 'Log in with GitHub'"
+                        v-if="loginWithGitHubText === $t('Settings.License.LogInToGithub')"
                         href="https://github.com/sponsors/swingmx"
                         target="_blank"
                     >
-                        <button>Sponsor on GitHub ❤️</button>
+                        <button>{{ $t('Settings.License.SponsorOnGithub') }}</button>
                     </a>
                 </div>
             </div>
@@ -39,13 +40,10 @@
         </div>
 
         <div v-if="!licenseInfo?.license" class="infocard rounded">
-            <div class="header"><span>No Active Subscription</span><CrownSvg /></div>
-            <div class="content">
-                Get a subscription to unlock all premium features. Use the link below to browse the available plans and
-                benefits.
-            </div>
+            <div class="header"><span>{{ $t('Settings.License.NoActiveSub') }}</span><CrownSvg /></div>
+            <div class="content"> {{ $t('Settings.License.NoActiveSubDesc') }}</div>
             <div class="footer">
-                <a href="https://swingmx.com/pricing" target="_blank" class="cta rounded-sm">View Pricing</a>
+                <a href="https://swingmx.com/pricing" target="_blank" class="cta rounded-sm">{{ $t('Settings.License.ViewPricing') }}</a>
             </div>
         </div>
 
@@ -54,9 +52,9 @@
             class="rounded"
             @submit.prevent="registerLicenseKey"
         >
-            <div class="header">{{ licenseInfo?.license_key ? 'License key info' : 'Already got a license key?' }}</div>
+            <div class="header">{{ licenseInfo?.license_key ? $t('Settings.License.LicenseKey.Info') : $t('Settings.License.LicenseKey.AlreadyHave') }}</div>
             <label for="license-key">{{
-                licenseInfo?.license_key ? 'Update your license key:' : 'Paste your license key here:'
+                licenseInfo?.license_key ? $t('Settings.License.LicenseKey.Update') : $t('Settings.License.LicenseKey.Paste')
             }}</label>
             <Input
                 input-id="license-key"
@@ -67,7 +65,7 @@
             />
 
             <div>
-                <label for="device-name">{{ licenseInfo ? 'Update' : 'New' }} server name:</label>
+                <label for="device-name">{{ $t('Settings.License.NewOrUpServerName', {action: licenseInfo ? $t('Common.Update') : $t('Common.New')}) }}</label>
                 <Input
                     input-id="device-name"
                     :text="licenseInfo?.devices.list?.find(d => d.current)?.device_name || ''"
@@ -77,8 +75,8 @@
 
                 <div v-if="submitEnabled" class="btngroup">
                     <button type="submit" class="btn-active" :disabled="!submitEnabled">
-                        <!-- {{ licenseInfo && licenseInfo.license_key !== licenseKey ? 'Update' : 'Activate' }} License -->
-                        Save Changes
+                        <!-- {{ $t('Settings.License.ActivateLicense', { action: licenseInfo && licenseInfo.license_key !== licenseKey ? $t('Common.Update') : $t('Common.Activate') }) }} -->
+                        {{ $t('Settings.License.SaveChanges') }}
                     </button>
                     <Spinner v-if="loading" />
                 </div>
@@ -96,13 +94,13 @@
 
         <div v-if="licenseInfo?.license.subscription" class="licenseMeta rounded">
             <h3 class="h2">
-                {{ `${licenseInfo.license.license_type === 'gh_sponsor' ? 'GitHub Sponsors' : 'Subscription'}` }}
-                Details
+                {{ `${licenseInfo.license.license_type === 'gh_sponsor' ? $t('Settings.License.GithubSponsors') : $t('Settings.License.Subscription')}` }}
+                {{ $t('Common.Details') }}
             </h3>
             <div class="content">
                 <div class="info">
                     <div class="label">
-                        {{ `${licenseInfo.license.license_type === 'gh_sponsor' ? 'Tier' : `Amount`}` }}
+                        {{ `${licenseInfo.license.license_type === 'gh_sponsor' ? $t('Settings.License.Tier') : $t('Settings.License.Amount')}` }}
                     </div>
                     <span class="primary">
                         {{
@@ -116,7 +114,7 @@
                     >
                 </div>
                 <div class="info">
-                    <div class="label">Status</div>
+                    <div class="label">{{ $t('Settings.License.Status') }}</div>
                     <span class="primary">
                         {{ licenseInfo?.license.subscription.status }}
                     </span>
@@ -124,23 +122,23 @@
                         <br />
                         {{
                             licenseInfo?.license.subscription.canceled_at
-                                ? 'CANCELLED ' + getTimeAgo(licenseInfo.license.subscription.canceled_at).toUpperCase()
+                                ? $t('Settings.License.CanceledAt').toUpperCase() + getTimeAgo(licenseInfo.license.subscription.canceled_at).toUpperCase()
                                 : ''
                         }}
                     </span>
                 </div>
                 <div v-if="licenseInfo?.license.subscription.recurring_interval !== 'one_time'" class="info">
-                    <div class="label">Renewal</div>
+                    <div class="label">{{ $t('Settings.License.Renewal') }}</div>
                     <span class="primary renewal">
                         {{
                             licenseInfo?.license.subscription.cancel_at_period_end
-                                ? 'Auto-renew off'
+                                ? $t('Settings.License.AutoRenewOff')
                                 : getDate(licenseInfo?.license.subscription.current_period_end || '')
                         }}
                     </span>
                 </div>
                 <div v-if="licenseInfo?.license.subscription.recurring_interval == 'one_time'" class="info">
-                    <div class="label">Expires</div>
+                    <div class="label">{{ $t('Settings.License.Expires') }}</div>
                     <span class="primary renewal">
                         {{ getDate(licenseInfo?.license.subscription.ends_at || '') }}
                     </span>
@@ -149,12 +147,9 @@
         </div>
 
         <div v-if="licenseInfo?.license.device_id" class="licenseinfo">
-            <h3 class="h2">Authorized Devices</h3>
+            <h3 class="h2">{{ $t('Settings.License.AuthDevices') }}</h3>
             <div class="desc">
-                Instances currently using your license key ({{ licenseInfo?.devices.active }}/{{
-                    licenseInfo?.devices.limit
-                }}
-                active)
+                {{ t('Settings.License.CurrentlyUsed', { cur: licenseInfo?.devices.active, tot: licenseInfo?.devices.limit}) }}
             </div>
             <div class="license-devices">
                 <div
@@ -175,7 +170,7 @@
                         <div class="lastseen">{{ getLastSeen(device.last_seen) }}</div>
                     </div>
 
-                    <button class="btnred" @click="() => logOutDevice(device.device_id)">Revoke</button>
+                    <button class="btnred" @click="() => logOutDevice(device.device_id)">{{ $t('Settings.License.Revoke') }}</button>
                 </div>
             </div>
         </div>
@@ -190,10 +185,9 @@
                         : 'https://polar.sh/swingmx/portal/overview'
                 "
                 target="_blank"
-            >
-                Manage {{ licenseInfo?.license.license_type === 'gh_sponsor' ? 'Sponsorship' : 'Subscription' }} ↗
+            > {{ $t('Settings.License.Manage', {lic: licenseInfo?.license.license_type === 'gh_sponsor' ? $t('Settings.License.Sponsorship') : $t('Settings.License.Subscription')}) }}
             </a>
-            <button class="btnred" @click="() => logOutDevice(settings.device_id)">Log Out</button>
+            <button class="btnred" @click="() => logOutDevice(settings.device_id)">{{ $t('Common.LogOut') }}</button>
         </div>
     </div>
 </template>
@@ -220,19 +214,21 @@ import useAxios from '@/requests/useAxios'
 import { LicenseInfo } from '@/interfaces'
 import useSettingsStore from '@/stores/settings'
 import { storeToRefs } from 'pinia'
+import { useT } from '@/i18n'
 
 TimeAgo.addLocale(en)
 
 let clientId = 'Ov23li5bsrEqMmqdT10i'
 let redirectUri = 'https://cloud.swingmx.com/auth/github/callback'
 
+const { t } = useT()
 const error = ref<string | null>(null)
 const loading = ref(false)
 const settings = useSettingsStore()
 const licenseKey = ref<string | null>(null)
 const deviceName = ref<string | null>(null)
 const licenseInfo = storeToRefs(useSettingsStore()).licenseInfo
-const loginWithGitHubText = ref<string>('Log in with GitHub')
+const loginWithGitHubText = ref<string>(t('Settings.License.LogInToGithub'))
 
 const submitEnabled = computed(() => {
     // If license has changed
@@ -256,11 +252,11 @@ const submitEnabled = computed(() => {
 function getRecurringInterval(interval: string) {
     switch (interval) {
         case 'month':
-            return 'mo'
+            return t('Common.Periods.MonthShort')
         case 'year':
-            return 'yr'
+            return t('Common.Periods.YearShort')
         case 'one_time':
-            return 'once'
+            return t('Common.Periods.OnceShort')
     }
 
     return interval
@@ -296,10 +292,10 @@ function getTimeAgo(date: string) {
 }
 
 function getLastSeen(date: string | null) {
-    if (!date) return 'No activity'
+    if (!date) return t('Settings.License.NoActivity')
 
     const timeAgo = new TimeAgo(userLocale()).format(new Date(date))
-    return `Last activity: ${timeAgo}`
+    return t('Settings.License.LastActivity', { time: timeAgo })
 }
 
 function handleLicenseKeyInput(value: string) {
@@ -388,9 +384,9 @@ async function logOutDevice(deviceId: string) {
 }
 
 async function loginWithGitHub() {
-    if (loginWithGitHubText.value === 'Refresh Status') {
+    if (loginWithGitHubText.value === t('Settings.License.RefreshStatus')) {
         return await getLicenseInfo(true).then(() => {
-            loginWithGitHubText.value = 'Log in with GitHub'
+            loginWithGitHubText.value = t('Settings.License.LogInToGithub')
         })
     }
 
@@ -406,7 +402,7 @@ async function loginWithGitHub() {
     const url = `${githubUrl}?${queryParams.toString()}`
     window.open(url, '_blank')
 
-    loginWithGitHubText.value = 'Refresh Status'
+    loginWithGitHubText.value = t('Settings.License.RefreshStatus')
 }
 
 onMounted(async () => {
diff --git a/src/components/SettingsView/Components/List.vue b/src/components/SettingsView/Components/List.vue
index bcdfff07..ae456a97 100644
--- a/src/components/SettingsView/Components/List.vue
+++ b/src/components/SettingsView/Components/List.vue
@@ -12,7 +12,7 @@
             </div>
         </div>
         <div v-if="!items.length" class="option-list-item" style="opacity: 0.5">
-            Root directories not configured. Use the "Configure" button above to configure
+            {{ $t('Settings.List.RootNotConfigured') }}
         </div>
     </div>
 </template>
diff --git a/src/components/SettingsView/Components/NumberInput.vue b/src/components/SettingsView/Components/NumberInput.vue
index eef12721..b195b534 100644
--- a/src/components/SettingsView/Components/NumberInput.vue
+++ b/src/components/SettingsView/Components/NumberInput.vue
@@ -6,9 +6,12 @@
 </template>
 
 <script setup lang="ts">
+import { useT } from '@/i18n';
 import { useToast } from '@/stores/notification'
 import { ref } from 'vue'
 
+const { t } = useT();
+
 const toast = useToast()
 
 const props = defineProps<{
@@ -22,7 +25,7 @@ function handleInput(e: Event) {
     const newValue = (e.target as HTMLInputElement).valueAsNumber
 
     if (Number.isNaN(newValue)) {
-        return toast.showError('Invalid number')
+        return toast.showError(t('Settings.NumberInput.InvalidNumber'))
     }
 
     if (newValue) {
@@ -34,9 +37,9 @@ async function submit(newValue: number) {
     const success = await props.callback(newValue)
 
     if (success) {
-        toast.showSuccess('Updated!')
+        toast.showSuccess(t('Settings.NumberInput.Updated'))
     } else {
-        toast.showError('Failed to update')
+        toast.showError(t('Settings.NumberInput.UpdateFailed'))
     }
 }
 </script>
diff --git a/src/components/SettingsView/Components/SecretInput.vue b/src/components/SettingsView/Components/SecretInput.vue
index b8f661da..35387cf6 100644
--- a/src/components/SettingsView/Components/SecretInput.vue
+++ b/src/components/SettingsView/Components/SecretInput.vue
@@ -8,7 +8,7 @@
             </button>
         </div>
         <div class="right">
-            <button>{{ buttonText ?? 'Save' }}</button>
+            <button>{{ buttonText ?? $t('Settings.Save')  }}</button>
         </div>
     </form>
 </template>
@@ -19,6 +19,7 @@ import { computed, onMounted, ref } from 'vue'
 import EyeSvg from '@/assets/icons/eye.svg'
 import EyeSlashSvg from '@/assets/icons/eye.slash.svg'
 
+
 const props = defineProps<{
     text?: string
     placeholder?: string
diff --git a/src/components/SettingsView/Components/SeparatorsInput.vue b/src/components/SettingsView/Components/SeparatorsInput.vue
index 70f673a9..5b35ae64 100644
--- a/src/components/SettingsView/Components/SeparatorsInput.vue
+++ b/src/components/SettingsView/Components/SeparatorsInput.vue
@@ -9,7 +9,7 @@
           </b></span
         >
       </div>
-      <button>Save</button>
+      <button>{{ $t('Settings.Save') }}</button>
     </form>
   </div>
 </template>
diff --git a/src/components/SettingsView/Content.vue b/src/components/SettingsView/Content.vue
index d58c10d6..53221c98 100644
--- a/src/components/SettingsView/Content.vue
+++ b/src/components/SettingsView/Content.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="settingscontent">
     <GenericHeader>
-      <template #name>Settings</template>
+      <template #name>{{ $t('Common.Settings') }}</template>
       <template #description>
-        Customize your settings and preferences
+        {{ $t('Content.SettingsDesc') }}
       </template>
     </GenericHeader>
     <GenericTabs
diff --git a/src/components/SettingsView/Group.vue b/src/components/SettingsView/Group.vue
index a99d249e..ff4f44c8 100644
--- a/src/components/SettingsView/Group.vue
+++ b/src/components/SettingsView/Group.vue
@@ -15,14 +15,14 @@
                         <span class="ellip">
                             {{ setting.title }}
                             <span v-if="setting.experimental" class="badge experimental circular">
-                                {{ setting.experimental ? 'experimental' : '' }}
+                                {{ setting.experimental ? $t('Common.experimental') : '' }}
                             </span>
                             <span v-if="setting.new" class="badge new circular">
-                                {{ setting.new ? 'new' : '' }}
+                                {{ setting.new ? $t('Common.new') : '' }}
                             </span>
                         </span>
                         <button v-if="setting.type == SettingType.root_dirs" @click="setting.action">
-                            <ReloadSvg height="1.5rem" /> <span>Rescan</span>
+                            <ReloadSvg height="1.5rem" /> <span>{{ $t('Common.Rescan') }}</span>
                         </button>
                     </div>
                     <div v-if="setting.desc" class="desc">
diff --git a/src/components/SettingsView/Nav.vue b/src/components/SettingsView/Nav.vue
index 898609bd..cf19fff6 100644
--- a/src/components/SettingsView/Nav.vue
+++ b/src/components/SettingsView/Nav.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="settingsnav">
     <button @click="resetClient">
-      &nbsp;&nbsp; Reset client &nbsp;&nbsp;
+      &nbsp;&nbsp; {{ $t('Nav.ResetClient') }} &nbsp;&nbsp;
     </button>
   </div>
 </template>
diff --git a/src/components/Stats/ChartItem.vue b/src/components/Stats/ChartItem.vue
index 7fdc7c67..1b39581d 100644
--- a/src/components/Stats/ChartItem.vue
+++ b/src/components/Stats/ChartItem.vue
@@ -4,11 +4,11 @@
         <div class="index">{{ index }}</div>
         <img :src="getItemImage(item)" class="chartimage" :class="name" />
         <div class="iteminfo">
-            <div class="title" :title="item.name" v-if="isArtist">
-                {{ item.name }} <MasterFlag v-if="item.trend?.is_new" :text="item.trend?.is_new ? 'New' : ''" :bitrate="1900"/>
+            <div class="title" :title="$t(mapToText(item.name))" v-if="isArtist">
+                {{ $t(mapToText(item.name)) }} <MasterFlag v-if="item.trend?.is_new" :text="item.trend?.is_new ? $t('Common.New') : ''" :bitrate="1900"/>
             </div>
             <div class="title" :title="item.title" v-if="isAlbumOrTrack">
-                {{ item.title }} <MasterFlag v-if="item.trend?.is_new" :text="item.trend?.is_new ? 'New' : ''" :bitrate="1900"/>
+                {{ item.title }} <MasterFlag v-if="item.trend?.is_new" :text="item.trend?.is_new ? $t('Common.New') : ''" :bitrate="1900"/>
             </div>
             <div class="artist" v-if="isAlbumOrTrack">
                 <ArtistName
@@ -17,7 +17,7 @@
                 />
             </div>
             <div class="artist" v-if="isArtist">
-                {{ item.extra['playcount'] }} track plays
+                {{ $t('ChartItem.ArtistPlays', { count: item.extra['playcount'] }) }}
             </div>
         </div>
         <div class="helptext">
@@ -48,6 +48,19 @@ const props = defineProps<{
 const isArtist = computed(() => props.name === 'artist')
 const isAlbumOrTrack = computed(() => props.name === 'album' || props.name === 'track')
 
+function mapToText(item: ChartItem): string {
+    switch (props.name) {
+        case 'artist':
+            return 'Common.Artist';
+        case 'album':
+            return 'Common.Album';
+        case 'track':
+            return 'Common.Track';
+        default:
+            return 'Common.Unknown';
+    }
+}
+
 function getItemImage(item: ChartItem) {
     switch (props.name) {
         case 'artist':
diff --git a/src/components/Stats/ChartItemGroup.vue b/src/components/Stats/ChartItemGroup.vue
index 48ad35e5..2c44e768 100644
--- a/src/components/Stats/ChartItemGroup.vue
+++ b/src/components/Stats/ChartItemGroup.vue
@@ -5,9 +5,9 @@
         <div class="noitems rounded-sm" v-if="items.length === 0">
             <div v-if="loading" class="loading">
                 <div class="spinner"></div>
-                <span>fetching data...</span>
+                <span>{{ $t('ChartItemGroup.FetchingData') }}</span>
             </div>
-            <div v-if="!loading && loaded">No {{ settings.statsgroup.slice(0, -1) }} data found for this period</div>
+            <div v-if="!loading && loaded">{{ $t('ChartItemGroup.NoDataFound', { per: settings.statsgroup.slice(0, -1) }) }}</div>
         </div>
         <ChartItem
             v-for="(item, index) in items"
diff --git a/src/components/Stats/Charts.vue b/src/components/Stats/Charts.vue
index 7a8d8b9b..79579ef7 100644
--- a/src/components/Stats/Charts.vue
+++ b/src/components/Stats/Charts.vue
@@ -1,8 +1,8 @@
 <template>
     <div class="stats-charts">
         <GenericHeader>
-            <template #name>Charts</template>
-            <template #description>Your top artists, albums, and tracks</template>
+            <template #name>{{ $t('Charts.ChartsTitle') }}</template>
+            <template #description>{{ $t('Charts.ChartsDescription') }}</template>
         </GenericHeader>
         <br>
         <div class="chartitemgroupsgrid">
diff --git a/src/components/Stats/ChartsHeader.vue b/src/components/Stats/ChartsHeader.vue
index be1dc6ec..d823ea23 100644
--- a/src/components/Stats/ChartsHeader.vue
+++ b/src/components/Stats/ChartsHeader.vue
@@ -9,7 +9,7 @@
                 :class="g === name ? 'active' : ''"
                 @click="$emit('changeGroup', g)"
             >
-                {{ g }}
+                {{ mapToText(g) }}
             </div>
         </div>
         <div class="period">
@@ -20,13 +20,18 @@
                 :class="p === period ? 'active' : ''"
                 @click="$emit('changePeriod', p)"
             >
-                {{ p }}
+                {{ mapToText(p) }}
             </div>
         </div>
     </div>
 </template>
 
 <script setup lang="ts">
+
+import { useT } from '@/i18n';
+
+const { t } = useT()
+
 defineProps<{
     name: string
     period: string
@@ -39,6 +44,25 @@ defineEmits<{
 
 const groups = ['artists', 'albums', 'tracks']
 const periods = ['week', 'month', 'year', 'alltime']
+
+function mapToText(name: string){
+    switch (name){
+        case 'artists':
+            return t('Common.Artist', 2).toLowerCase();
+        case 'albums':
+            return t('Common.Album', 2).toLowerCase();
+        case 'tracks':
+            return t('Common.Track', 2).toLowerCase();
+        case 'week':
+            return t('Common.Periods.Week', 1).toLowerCase();
+        case 'month':
+            return t('Common.Periods.Month', 1).toLowerCase();
+        case 'year':
+            return t('Common.Periods.Year', 1).toLowerCase();
+        case 'alltime':
+            return t('Common.Periods.AllTime').toLowerCase();
+    }
+}
 </script>
 
 <style lang="scss">
diff --git a/src/components/bubbles/DropArea.vue b/src/components/bubbles/DropArea.vue
index fed2cc0f..8d26f367 100644
--- a/src/components/bubbles/DropArea.vue
+++ b/src/components/bubbles/DropArea.vue
@@ -1,11 +1,10 @@
 <template>
   <div class="bin-drop-area t-center rounded-sm">
     <div class="bin-count circular">10</div>
-    DROP TRACKS HERE
+    {{ $t('Bubbles.DropHere') }}
     <br />
   </div>
 </template>
-
 <style lang="scss">
 .bin-drop-area {
   // background-color: $gray;
diff --git a/src/components/modal.vue b/src/components/modal.vue
index 44740dc2..bbd48ae1 100644
--- a/src/components/modal.vue
+++ b/src/components/modal.vue
@@ -36,7 +36,7 @@
             />
             <div v-if="modal.component == modal.options.deletePlaylist">
                 <ConfirmModal
-                    :text="'Are you sure you want to permanently delete this playlist?'"
+                    :text="$t('Modal.DeletePlaylist')"
                     :cancel-action="modal.hideModal"
                     :confirm-action="deletePlaylist"
                 />
diff --git a/src/components/modals/AuthLogin.vue b/src/components/modals/AuthLogin.vue
index a4e95c07..60293cba 100644
--- a/src/components/modals/AuthLogin.vue
+++ b/src/components/modals/AuthLogin.vue
@@ -3,7 +3,7 @@
         <div class="head" :class="{ selected }">
             <button
                 class="back rounded-sm"
-                title="Back to selection"
+                :title="$t('AuthLogin.BackToSelection')"
                 @click="resetSelected"
                 :style="{
                     visibility: shownUsers.length > 1 ? 'visible' : 'hidden',
@@ -12,12 +12,12 @@
                 <span>back</span> <ArrowSvg />
             </button>
             <Logo />
-            <button class="back back2 rounded-sm" title="Back to selection"><span>back</span> <ArrowSvg /></button>
+            <button class="back back2 rounded-sm" :title="$t('AuthLogin.BackToSelection')"><span>{{ $t('AuthLogin.Back') }}</span> <ArrowSvg /></button>
         </div>
 
         <div class="alcontent">
             <div class="helptext" v-if="!selected">
-                <div class="h2">Welcome back</div>
+                <div class="h2">{{ $t('AuthLogin.WelcomeBack') }}</div>
             </div>
             <div class="selected-user" v-if="selected">
                 <User
@@ -32,23 +32,23 @@
             <form class="passinput" v-if="selected" v-auto-animate @submit.prevent="loginUser">
                 <!-- Only show username input if there's no user list -->
                 <Input
-                    placeholder="Enter username"
+                    :placeholder="$t('AuthLogin.EnterUsername')"
                     v-if="selected.username === ''"
                     input-id="loginuserinput"
                     @input="(input: string) => username = input"
                 />
                 <Input
                     type="password"
-                    placeholder="Enter password"
+                    :placeholder="$t('AuthLogin.EnterPassword')"
                     input-id="loginpassinput"
                     @input="(input: string) => password = input"
                 />
                 <!-- v-if="username.length && password.length" -->
-                <button class="submit" :class="{ long: selected.username !== '' }">Login</button>
+                <button class="submit" :class="{ long: selected.username !== '' }">{{ $t('Common.LogIn') }}</button>
             </form>
         </div>
         <div v-if="guestAllowed" class="guestlink" @click="() => guestLogin()">
-            <span>Or continue as guest </span>
+            <span>{{ $t('AuthLogin.ContinueAsGuest') }} </span>
         </div>
     </div>
 </template>
diff --git a/src/components/modals/ConfirmModal.vue b/src/components/modals/ConfirmModal.vue
index 5407d07e..e0198b27 100644
--- a/src/components/modals/ConfirmModal.vue
+++ b/src/components/modals/ConfirmModal.vue
@@ -2,13 +2,14 @@
     <div class="confirm-modal">
         <div class="t-center" style="padding: 0 4rem">{{ text }}</div>
         <div class="buttons">
-            <button class="cancel" @click="cancelAction">Cancel</button>
-            <button class="confirm" @click="confirmAction">Delete</button>
+            <button class="cancel" @click="cancelAction">{{ $t('ConfirmModal.Cancel') }}</button>
+            <button class="confirm" @click="confirmAction">{{ $t('ConfirmModal.Delete') }}</button>
         </div>
     </div>
 </template>
 
 <script setup lang="ts">
+
 defineProps<{
     text: string
     confirmAction: () => void
diff --git a/src/components/modals/CrudPage.vue b/src/components/modals/CrudPage.vue
index 3b91023a..361a59f4 100644
--- a/src/components/modals/CrudPage.vue
+++ b/src/components/modals/CrudPage.vue
@@ -1,20 +1,20 @@
 <template>
     <form action="" v-if="delete">
         <br>
-        <div>Are you sure you want to delete this collection?</div>
+        <div>{{ $t('CrudPage.DeleteDescription') }}</div>
         <br />
-        <button @click.prevent="submit" class="critical">Yes, Delete</button>
+        <button @click.prevent="submit" class="critical">{{ $t('CrudPage.DeleteButton') }}</button>
     </form>
     <form class="playlist-modal" @submit.prevent="submit" v-else>
-        <label for="name">Collection name</label>
+        <label for="name">{{ $t('CrudPage.CollectionName') }}</label>
         <br />
         <input type="search" class="rounded-sm" id="name" :value="collection?.name" />
         <br />
-        <label for="description">Description</label>
+        <label for="description">{{ $t('CrudPage.Description') }}</label>
         <br />
         <input type="search" class="rounded-sm" id="description" :value="collection?.extra.description" />
         <br /><br />
-        <button type="submit">{{ collection ? 'Update' : 'Create' }}</button>
+        <button type="submit">{{ collection ? $t('CrudPage.Update') : $t('CrudPage.Create') }}</button>
     </form>
 </template>
 
@@ -23,6 +23,9 @@ import { Collection } from '@/interfaces'
 import { createNewCollection, deleteCollection, updateCollection } from '@/requests/collections'
 import { router } from '@/router'
 import { NotifType, Notification } from '@/stores/notification'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 const props = defineProps<{
     collection?: Collection
@@ -37,13 +40,13 @@ const emit = defineEmits<{
     (e: 'setTitle', title: string): void
 }>()
 
-emit('setTitle', (props.collection ? (props.delete ? 'Delete' : 'Update') : 'New') + ' Collection')
+emit('setTitle', (props.collection ? (props.delete ? t('CrudPage.DeleteTitle') : t('CrudPage.UpdateTitle')) : t('CrudPage.NewTitle')) + t('CrudPage.CollectionTitle'))
 
 async function submit(e: Event) {
     if (props.delete && props.collection) {
         const deleted = await deleteCollection(props.collection.id)
         if (deleted) {
-            new Notification('Collection deleted', NotifType.Success)
+            new Notification(t('CrudPage.DeleteNotification'), NotifType.Success)
             emit('hideModal')
             router.push('/')
         }
@@ -65,7 +68,7 @@ async function submit(e: Event) {
         ])
 
         if (created) {
-            new Notification('New collection created', NotifType.Success)
+            new Notification(t('CrudPage.CreateNotification'), NotifType.Success)
             emit('hideModal')
         }
     } else {
@@ -74,7 +77,7 @@ async function submit(e: Event) {
         if (updatedPage) {
             props.collection.name = updatedPage.name
             props.collection.extra.description = updatedPage.extra.description
-            new Notification('Collection updated', NotifType.Success)
+            new Notification(t('CrudPage.UpdateNotification'), NotifType.Success)
             emit('hideModal')
         }
     }
diff --git a/src/components/modals/NewPlaylist.vue b/src/components/modals/NewPlaylist.vue
index b1126323..337dfc0e 100644
--- a/src/components/modals/NewPlaylist.vue
+++ b/src/components/modals/NewPlaylist.vue
@@ -1,17 +1,17 @@
 <template>
   <form class="playlist-modal" @submit="create">
-    <label for="name">Playlist name</label>
+    <label for="name">{{ $t('NewPlaylist.PlaylistName') }}</label>
     <br />
     <input
       id="modal-playlist-name-input"
       type="search"
       class="rounded-sm"
       name="name"
-      placeholder="Type a name..."
+      :placeholder="$t('NewPlaylist.NamePlaceholder')"
       spellcheck="false"
     />
     <br /><br />
-    <button type="submit">Create</button>
+    <button type="submit">{{ $t('NewPlaylist.CreateButton') }}</button>
   </form>
 </template>
 
@@ -29,6 +29,9 @@ import {
 import { NotifType, Notification } from "@/stores/notification";
 import usePlaylistStore from "@/stores/pages/playlists";
 import useTracklist from "@/stores/queue/tracklist";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const props = defineProps<{
   trackhash?: string;
@@ -52,7 +55,7 @@ const emit = defineEmits<{
   (e: "hideModal"): void;
 }>();
 
-emit("setTitle", "New Playlist");
+emit("setTitle", t('NewPlaylist.Title'));
 
 /**
  * Create a new playlist. If this modal is called with a track,
@@ -64,7 +67,7 @@ function create(e: Event) {
   const name = (e.target as any).elements["name"].value;
 
   if (!name.trim()) {
-    new Notification("Playlist name can't be empty", NotifType.Error);
+    new Notification( t('NewPlaylist.NameNotEmpty'), NotifType.Error);
     return;
   }
 
diff --git a/src/components/modals/RootDirsPrompt.vue b/src/components/modals/RootDirsPrompt.vue
index 09b5749c..a9c911b6 100644
--- a/src/components/modals/RootDirsPrompt.vue
+++ b/src/components/modals/RootDirsPrompt.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="root-dirs-prompt">
-    <h3 class="t-center">Where do you want to look for music?</h3>
+    <h3 class="t-center">{{ $t('RootDirsPrompt.WhereToLook') }}</h3>
     <div class="options-group">
       <div v-for="option in options" :key="option.id" v-motion-slide-bottom class="option" @click="option.action()">
         <b>{{ option.title }}</b>
@@ -16,6 +16,9 @@ import { onMounted, ref } from "vue";
 import { addRootDirs, getRootDirs } from "@/requests/settings/rootdirs";
 import useModalStore from "@/stores/modal";
 import useSettingsStore from "@/stores/settings";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const settings = useSettingsStore();
 
@@ -36,8 +39,8 @@ onMounted(() => {
       options.value = [
         {
           id: "$home",
-          title: "Home directory",
-          info: "Scan all folders in your home directory.",
+          title: t('RootDirsPrompt.HomeDir'),
+          info: t('RootDirsPrompt.HomeDirInfo'),
           delay: 0,
           action: () =>
             addRootDirs(["$home"], [])
@@ -46,8 +49,8 @@ onMounted(() => {
         },
         {
           id: "wtf",
-          title: "Specific directories",
-          info: "Select folders to scan for music.",
+          title: t('RootDirsPrompt.SpecificDir'),
+          info: t('RootDirsPrompt.SpecificDirInfo'),
           delay: 0.1,
           action: () => modal.showSetRootDirsModal(),
         },
diff --git a/src/components/modals/SetRootDirs.vue b/src/components/modals/SetRootDirs.vue
index 46a771b3..e461d339 100644
--- a/src/components/modals/SetRootDirs.vue
+++ b/src/components/modals/SetRootDirs.vue
@@ -9,8 +9,7 @@
     </div>
     <div class="set-root-dirs-browser">
       <h4 v-if="no_more_dirs">
-        <span class="folder_icon">📂</span> No folders here. Click the "Add this folder" button below to select this
-        location.
+        <span class="folder_icon">📂</span> {{ $t('SetRootDirs.NoSubFolders') }}
       </h4>
       <div class="scrollable">
         <div class="content">
@@ -25,8 +24,8 @@
         </div>
       </div>
       <div class="buttons">
-        <button class="btn-active select-here" @click="selectHere">Add this folder</button>
-        <button class="btn-active finish" @click="submitFolders">Add all checked ({{ getNewDirs().length }})</button>
+        <button class="btn-active select-here" @click="selectHere"> {{ $t('SetRootDirs.SelectThisFolder') }} </button>
+        <button class="btn-active finish" @click="submitFolders"> {{ $t('SetRootDirs.AddAllChecked') }} ({{ getNewDirs().length }})</button>
       </div>
     </div>
   </div>
diff --git a/src/components/modals/Settings.vue b/src/components/modals/Settings.vue
index 8be8eb01..358a0cf8 100644
--- a/src/components/modals/Settings.vue
+++ b/src/components/modals/Settings.vue
@@ -19,7 +19,7 @@
                     </button>
                     {{ currentGroup?.displayName || currentGroup?.title }}
                     <span v-if="currentGroup?.experimental" class="badge experimental circular">
-                        {{ currentGroup?.experimental ? 'experimental' : '' }}
+                        {{ currentGroup?.experimental ? $t('Settings.Experimental') : '' }}
                     </span>
                 </div>
                 <div v-if="currentGroup?.desc" class="desc">
diff --git a/src/components/modals/settings/Profile.vue b/src/components/modals/settings/Profile.vue
index 865d468e..68d3834e 100644
--- a/src/components/modals/settings/Profile.vue
+++ b/src/components/modals/settings/Profile.vue
@@ -3,29 +3,42 @@
         <div class="profileavatar">
             <Avatar :name="username || auth.user.username" />
             <div class="name">
-                {{ adding_user ? username : `Hi ${auth.user.username}` }}
+                {{ adding_user ? username : $t('Profile.HiUser', {user: auth.user.username}) }}
             </div>
             <div v-if="!adding_user" class="roles">
                 <span v-for="role in auth.user.roles" :key="role" class="role"> {{ role }}</span>
             </div>
         </div>
+        <div class="updateprof">
+            <div class="locale-changer">
+                <label>{{ $t('Languages.ChooseLang') }}</label>
+                <select class="language" v-model="$i18n.locale" @change="updateLang">
+                    <option v-for="locale in $i18n.availableLocales" :key="`locale-${locale}`" :value="locale">{{ $t('Languages.'+ locale) }}</option>
+                </select>
+            </div>                
+            <button v-if="setLang" @click="setCookie">
+                {{ $t('Profile.SetLanguage') }}
+            </button>
+            <label class="warning" v-if="setLang">{{ $t('Languages.WarnAppReload') }}</label>
+        </div>
         <form v-auto-animate class="updateprof" @submit.prevent="handleSubmit">
             <div class="names">
-                <label for="username">Username</label>
+                <label for="username">{{ $t('Profile.Username')}}<</label>
                 <Input
-                    :placeholder="adding_user ? 'username' : auth.user.username"
+                    :placeholder="adding_user ? $t('Profile.Username')  : auth.user.username"
                     @input="input => (username = input)"
                 />
             </div>
-            <label for="pswd">{{ adding_user ? 'Create' : 'Change' }} password</label>
+            <label for="pswd">{{ adding_user ? $t('Profile.PasswordAction', { action: $t('Common.Create') }) 
+                : $t('Profile.PasswordAction', { action: $t('Common.Change') }) }}</label>
             <Input type="password" placeholder="✶✶✶✶✶✶✶✶" @input="input => (password = input)" />
             <div v-if="password.length" class="confirmpassword">
-                <label for="confirmpswd">Confirm password</label>
+                <label for="confirmpswd">{{ $t('Profile.ConfirmPassword') }}<</label>
                 <Input type="password" placeholder="✶✶✶✶✶✶✶✶" @input="input => (confirmPassword = input)" />
                 <label v-if="errorText" class="error">{{ errorText }}</label>
             </div>
             <button v-if="showSubmit">
-                {{ adding_user ? 'Add user' : 'Update' }}
+                {{ adding_user ? $t('Profile.AddUser') : $t('Common.Update') }}
             </button>
         </form>
     </div>
@@ -33,12 +46,19 @@
 
 <script setup lang="ts">
 import { computed, onMounted, ref } from 'vue'
+import { useI18n } from 'vue-i18n';
+import { useRouter } from 'vue-router';
+import { useCookies } from '@vueuse/integrations/useCookies';
 
 import Avatar from '@/components/shared/Avatar.vue'
 import Input from '@/components/shared/Input.vue'
 import { User } from '@/interfaces'
 import useAuth from '@/stores/auth'
 
+const cookies = useCookies(['locale']);
+const router = useRouter();
+const { t, locale } = useI18n();
+
 const props = defineProps<{
     adding_user?: boolean
 }>()
@@ -51,6 +71,7 @@ const auth = useAuth()
 
 const username = ref('')
 const password = ref('')
+const langIns = ref(false)
 const confirmPassword = ref('')
 
 const showSubmit = computed(() => {
@@ -65,6 +86,21 @@ const showSubmit = computed(() => {
         (payload.value.username || payload.value.password)
     )
 })
+const setLang = computed(()=> {
+    return (langIns.value)
+})
+
+const setCookie = function() {
+    cookies.set('locale', locale.value)
+    langIns.value = false
+    // FIXME: Feels like a hack to force reload the whole app; but parts of the UI doesn't update it properly.
+    //  Adding cookies dependencies to all components might be the only alternative.
+    router.go(0);
+}
+
+const updateLang = function() {
+    langIns.value = true
+}
 
 const errorText = computed(() => {
     // if password has not changed, no error
@@ -73,7 +109,7 @@ const errorText = computed(() => {
     }
 
     if (confirmPassword.value.length && password.value !== confirmPassword.value) {
-        return 'Passwords do not match'
+        return t('Profile.PasswordMismatch')
     }
 })
 
@@ -114,6 +150,7 @@ async function updateProfile() {
         username.value = ''
         password.value = ''
         confirmPassword.value = ''
+        langIns.value = false
     }
 }
 
@@ -162,6 +199,15 @@ onMounted(async () => {
             color: $gray1;
         }
 
+        select {
+            width: 100%;
+            margin-bottom: 0.5rem;
+            margin-top: 0.5rem;
+            font-weight: 500;
+            font-size: 0.9rem;
+            color: $white;
+        }
+
         input {
             width: 100%;
             padding: 0.5rem;
@@ -184,6 +230,12 @@ onMounted(async () => {
             color: $red;
         }
 
+        .warning {
+            width: 100%;
+            color: $yellow;
+            text-align: center;
+        }
+
         button {
             background: $darkblue;
             padding: $medium 1.5rem;
diff --git a/src/components/modals/settings/custom/Accounts.vue b/src/components/modals/settings/custom/Accounts.vue
index b3c556bf..5546d544 100644
--- a/src/components/modals/settings/custom/Accounts.vue
+++ b/src/components/modals/settings/custom/Accounts.vue
@@ -12,10 +12,10 @@
             />
         </div>
         <div class="ahead">
-            <div class="h2">All users</div>
+            <div class="h2">{{ $t('Accounts.AllUsers') }}</div>
             <button class="adduser" @click="showAddUser = true">
                 <PlusSvg />
-                New user
+                {{ $t('Accounts.NewUser') }}
             </button>
         </div>
         <TransitionGroup name="list">
@@ -82,6 +82,9 @@ import PlusSvg from '@/assets/icons/plus.svg'
 import Avatar from '@/components/shared/Avatar.vue'
 import Profile from '../Profile.vue'
 import ToggleSetting from './ToggleSetting.vue'
+import { useT } from '@/i18n.js'
+
+const { t } = useT();
 
 const auth = useAuth()
 const toast = useToast()
@@ -97,8 +100,8 @@ const settingsMap = {
 
 const account_settings = [
     {
-        title: 'Enable guest access',
-        desc: 'Allow users to access the site without an account',
+        title: t('Accounts.EnableGuestAccess'),
+        desc: t('Accounts.EnableGuestAccessDesc'),
         type: SettingType.binary,
         value: settingsMap.enableGuest,
         action: async () => {
@@ -115,8 +118,8 @@ const account_settings = [
         },
     },
     {
-        title: 'Show users on login',
-        desc: 'Show a list of users on your server when logging in',
+        title: t('Accounts.ShowUsersOnLogin'),
+        desc: t('Accounts.ShowUsersOnLoginDesc'),
         type: SettingType.binary,
         value: settingsMap.usersOnLogin,
         action: async () => {
@@ -138,8 +141,8 @@ const account_settings = [
 
 const usettings = [
     {
-        title: 'Admin',
-        desc: 'Can do anything',
+        title: t('Accounts.Admin'),
+        desc: t('Accounts.AdminDesc'),
         value: (roles: string[]) => {
             return roles.includes('admin')
         },
@@ -169,7 +172,7 @@ const usettings = [
 
 async function deleteUser(user: User) {
     if (user.username === auth.user.username) {
-        return toast.showError('Sorry! You cannot delete yourself')
+        return toast.showError(t('Accounts.NoSelfDelete'))
     }
 
     const success = await auth.deleteUser(user.username)
diff --git a/src/components/modals/settings/custom/Pairing.vue b/src/components/modals/settings/custom/Pairing.vue
index 2c50472a..6b89cced 100644
--- a/src/components/modals/settings/custom/Pairing.vue
+++ b/src/components/modals/settings/custom/Pairing.vue
@@ -12,7 +12,7 @@
             <div class="spinner"></div>
         </div>
         <p class="desc">
-            Scan the QR code from the Swing Music app to pair with this server.
+            {{ $t('Pairing.ScanQRCode') }}
         </p>
 
         <div class="serverurl rounded">{{ url }}</div>
@@ -23,6 +23,9 @@
 import { Ref, onMounted, ref } from 'vue'
 import QRCodeStyling from 'qr-code-styling'
 import { sendPairRequest } from '@/requests/auth'
+import { useT } from '@/i18n';
+
+const { t } = useT();
 
 const qrLoaded = ref(false)
 // @ts-expect-error
@@ -66,7 +69,7 @@ onMounted(async () => {
     }
 
     const error = document.createElement('p')
-    error.innerHTML = 'Error fetching pairing code. Error code: ' + res.status
+    error.innerHTML = t('Pairing.ErrorPairingCode', {res: res.status})
     qrcode.value.appendChild(error)
 })
 </script>
diff --git a/src/components/modals/updatePlaylist.vue b/src/components/modals/updatePlaylist.vue
index f5bbe6c3..71b46c25 100644
--- a/src/components/modals/updatePlaylist.vue
+++ b/src/components/modals/updatePlaylist.vue
@@ -6,7 +6,7 @@
         autocomplete="off"
         @submit.prevent="update_playlist"
     >
-        <label for="name">Playlist name</label>
+        <label for="name">{{ $t('UpdatePlaylist.Name') }}</label>
         <input
             id="modal-playlist-name-input"
             v-model="pname"
@@ -17,7 +17,7 @@
             @keypress.enter.prevent="update_playlist"
         />
 
-        <label for="image">Image</label>
+        <label for="image">{{ $t('Common.Image') }}</label>
         <input
             id="update-pl-image-upload"
             ref="dropZoneRef"
@@ -30,7 +30,7 @@
         <div id="upload" class="boxed rounded-sm">
             <div class="clickable" tabindex="0" @click="selectFiles" @keydown.space.enter.stop="selectFiles">
                 <ImageIcon />
-                Click to {{ playlist.has_image ? 'update' : 'upload' }} cover image
+                {{ $t('UpdatePlaylist.CoverAction', {action: playlist.has_image ? $t('Common.update') : $t('Common.upload')}) }}
             </div>
             <div
                 id="update-pl-img-preview"
@@ -45,13 +45,13 @@
                 </div>
             </div>
         </div>
-        <label v-if="playlist.has_image && !playlist.settings.square_img">Settings</label>
+        <label v-if="playlist.has_image && !playlist.settings.square_img">{{ $t('Common.Settings') }}</label>
         <div v-if="image || playlist.has_image" class="banner-settings rounded-sm">
-            <div>Show square cover image</div>
+            <div>{{ $t('UpdatePlaylist.SquareCover') }}</div>
             <Switch :state="playlist.settings.square_img || false" @click="pStore.toggleSquareImage" />
         </div>
         <div v-if="playlist.has_image && !playlist.settings.square_img" class="boxed banner-position-adjust rounded-sm">
-            <div class="t-center">Adjust image position • {{ pStore.info.settings.banner_pos }}%</div>
+            <div class="t-center">{{ $t('UpdatePlaylist.ImagePosition', {pos: pStore.info.settings.banner_pos }) }}</div>
             <div class="buttons">
                 <button @click.stop.prevent="pStore.minusBannerPos">
                     <ExpandSvg />
@@ -63,7 +63,7 @@
         </div>
 
         <button type="submit">
-            {{ clicked ? 'Saving' : 'Update' }}
+            {{ clicked ? $t('Common.Saving') : $t('Common.Update') }}
         </button>
     </form>
 </template>
@@ -80,7 +80,9 @@ import ExpandSvg from '@/assets/icons/expand.svg'
 import ImageIcon from '@/assets/icons/image.svg'
 
 import Switch from '../SettingsView/Components/Switch.vue'
+import { useT } from '@/i18n.js'
 
+const { t } = useT()
 const pStore = usePStore()
 const { info: playlist } = storeToRefs(pStore)
 
@@ -96,7 +98,7 @@ const emit = defineEmits<{
     (e: 'hideModal'): void
 }>()
 
-emit('setTitle', 'Update Playlist')
+emit('setTitle', t('Modal.UpdatePlaylist'))
 
 function selectFiles() {
     const input = document.getElementById('update-pl-image-upload') as HTMLInputElement
diff --git a/src/components/nav/NavLinks.vue b/src/components/nav/NavLinks.vue
index 09f0ea6b..789fe2da 100644
--- a/src/components/nav/NavLinks.vue
+++ b/src/components/nav/NavLinks.vue
@@ -18,7 +18,8 @@
 </template>
 
 <script setup lang="ts">
-import { topnavitems } from "../LeftSidebar/navitems";
+  import { useNavItems } from "../LeftSidebar/navitems";
+  const { topnavitems } = useNavItems();
 </script>
 
 <style lang="scss">
diff --git a/src/components/nav/NavSidenav.vue b/src/components/nav/NavSidenav.vue
index 9f3e9f09..2f9f1736 100644
--- a/src/components/nav/NavSidenav.vue
+++ b/src/components/nav/NavSidenav.vue
@@ -3,7 +3,7 @@
         <div class="sidenav_header">
             <a @click="closeSidenav" class="sidenav_logo" href="#">
                 <div class="art"><LogoSvg /></div>
-                <div class="title">Swing Music</div>
+                <div class="title">{{ $t('Common.AppTitle') }}</div>
             </a>
         </div>
         <div class="sidenav_content scrollable">
@@ -26,7 +26,8 @@
 
 <script setup lang="ts">
 import LogoSvg from '@/assets/icons/logos/logo-fill.light.svg'
-import { topnavitems } from '../LeftSidebar/navitems'
+import { useNavItems } from "../LeftSidebar/navitems";
+const { topnavitems } = useNavItems();
 
 const emit = defineEmits(['close'])
 
diff --git a/src/components/nav/NavTitles.vue b/src/components/nav/NavTitles.vue
index 9f5de9aa..84214cd3 100644
--- a/src/components/nav/NavTitles.vue
+++ b/src/components/nav/NavTitles.vue
@@ -1,13 +1,13 @@
 <template>
   <div class="info">
-    <SettingsTitle v-if="$route.name == Routes.settings" :text="'Settings'" />
+    <SettingsTitle v-if="$route.name == Routes.settings" :text="$t('NavTitles.Settings')" />
     <SearchTitle v-if="$route.name == Routes.search" />
     <PlaylistsTitle v-if="$route.name == Routes.playlists" />
     <SimpleNav
       v-if="$route.name == Routes.artistTracks"
-      :text="$route.query.artist as string || 'Artist Tracks'"
+      :text="$route.query.artist as string || $t('NavTitles.ArtistTracks')"
     />
-    <SimpleNav v-if="$route.name === Routes.nowPlaying" :text="'Now Playing'" />
+    <SimpleNav v-if="$route.name === Routes.nowPlaying" :text="$t('NavTitles.NowPlaying')" />
   </div>
 </template>
 
diff --git a/src/components/nav/ProfileDropdown.vue b/src/components/nav/ProfileDropdown.vue
index efc6dbd6..27fa0f58 100644
--- a/src/components/nav/ProfileDropdown.vue
+++ b/src/components/nav/ProfileDropdown.vue
@@ -1,20 +1,20 @@
 <template>
     <div class="profiledrop rounded-md pad-sm shadow-lg noSelect">
         <div class="info item">
-            <div class="username ellip2">Hi {{ auth.user.firstname || auth.user.username }}</div>
+            <div class="username ellip2">{{ $t('ProfileDropdown.HiUser', { user: auth.user.firstname || auth.user.username }) }}</div>
         </div>
         <div class="separator"></div>
         <div class="item scan" @click="triggerScan">
-            <div class="label">Quick scan</div>
+            <div class="label">{{ $t('ProfileDropdown.QuickScan') }}</div>
             <ReloadSvg />
         </div>
         <div class="item" @click="modal.showSettingsModal">
-            <div class="label">Settings</div>
+            <div class="label">{{ $t('Common.Settings') }}</div>
             <SettingsSvg />
         </div>
         <div class="separator"></div>
         <div class="item critical logout" @click="auth.logout">
-            <div class="label">Log out</div>
+            <div class="label">{{ $t('Common.LogOut') }}</div>
             <LogoutSvg />
         </div>
     </div>
diff --git a/src/components/nav/Titles/Folder.vue b/src/components/nav/Titles/Folder.vue
index 33e2ad46..dfb719d8 100644
--- a/src/components/nav/Titles/Folder.vue
+++ b/src/components/nav/Titles/Folder.vue
@@ -34,6 +34,10 @@ import BreadCrumbNav from '@/components/FolderView/BreadCrumbNav.vue'
 import DropDown from '@/components/shared/DropDown.vue'
 import useFolder from '@/stores/pages/folder'
 import { computed } from 'vue'
+import { useT } from '@/i18n'
+
+
+const { t } = useT();
 
 const router = useRouter()
 const folder = useFolder()
@@ -48,20 +52,20 @@ interface SortItem {
 }
 
 const items: SortItem[] = [
-    { key: 'default', title: 'Default' },
-    { key: 'title', title: 'Title' },
-    { key: 'filepath', title: 'File Name' },
-    { key: 'album', title: 'Album' },
-    // { key: 'albumartists', title: 'Album Artist' },
-    { key: 'artists', title: 'Artist' },
-    // { key: 'bitrate', title: 'Bitrate' },
-    { key: 'date', title: 'Release Date' },
-    // { key: 'disc', title: 'Disc' },
-    // { key: 'duration', title: 'Duration' },
-    { key: 'last_mod', title: 'Date Added' },
-    { key: 'lastplayed', title: 'Last Played' },
-    { key: 'playcount', title: 'Play Count' },
-    { key: 'playduration', title: 'Play Duration' },
+    { key: 'default', title: t('Common.Default') },
+    { key: 'title', title: t('Common.Title') },
+    { key: 'filepath', title: t('Common.FileName') },
+    { key: 'album', title:  t('Common.Album') },
+    // { key: 'albumartists', title: t('Common.AlbumArtist')} },
+    { key: 'artists', title: t('Common.Artist', 2) },
+    // { key: 'bitrate', title: t('Common.Bitrate') },
+    { key: 'date', title: t('Common.ReleaseDate') },
+    // { key: 'disc', title: t('Common.Disc') },
+    // { key: 'duration', title: t('Common.Duration') },
+    { key: 'last_mod', title: t('Common.DateAdded') },
+    { key: 'lastplayed', title: t('Common.LastPlayed') },
+    { key: 'playcount', title: t('Common.PlayCount') },
+    { key: 'playduration', title: t('Common.PlayDuration') },
 ]
 
 const handleSortKeySet = (item: SortItem) => {
diff --git a/src/components/nav/Titles/PlaylistsTitle.vue b/src/components/nav/Titles/PlaylistsTitle.vue
index 13fa195e..35321e20 100644
--- a/src/components/nav/Titles/PlaylistsTitle.vue
+++ b/src/components/nav/Titles/PlaylistsTitle.vue
@@ -1,7 +1,7 @@
 <template>
   <div v-if="isSmall" class="playlists-nav">
     <div class="buttons">
-      <button @click="showNewPlaylistModal()"><PlusSvg /> New Playlist</button>
+      <button @click="showNewPlaylistModal()"><PlusSvg /> {{ $t('NewPlaylist.Title') }}</button>
     </div>
   </div>
 </template>
@@ -11,6 +11,7 @@ import PlusSvg from "@/assets/icons/plus.svg";
 import { isSmall } from "@/stores/content-width";
 
 import useModalStore from "@/stores/modal";
+
 const { showNewPlaylistModal } = useModalStore();
 </script>
 
diff --git a/src/components/shared/ArtistCard.vue b/src/components/shared/ArtistCard.vue
index 33d020e3..e2615a05 100644
--- a/src/components/shared/ArtistCard.vue
+++ b/src/components/shared/ArtistCard.vue
@@ -28,7 +28,7 @@
             {{ artist.name }}
         </div>
         <div v-if="artist.help_text && artist.trackcount" class="racount t-center">
-            {{ artist.trackcount }} Track{{ artist.trackcount == 1 ? '' : 's' }}
+            {{ $t('ArtistCard.TrackCount', {count: artist.trackcount}, artist.trackcount) }}
         </div>
     </RouterLink>
 </template>
diff --git a/src/components/shared/DropDown.vue b/src/components/shared/DropDown.vue
index 974f8302..5dcdc6c7 100644
--- a/src/components/shared/DropDown.vue
+++ b/src/components/shared/DropDown.vue
@@ -6,7 +6,7 @@
                 :class="{ showDropDown }"
                 :title="
                     reverse !== 'hide'
-                        ? `sort by: ${current.title} ${reverse ? 'Descending' : 'Ascending'}`.toUpperCase()
+                        ? $t('DropDown.SortByUppercase', { title: current.title.toUpperCase(), order: reverse ? $t('Common.Descending').toUpperCase() : $t('Common.Ascending').toUpperCase() })
                         : undefined
                 "
                 @click.prevent="handleOpener"
diff --git a/src/components/shared/FavoritesCard.vue b/src/components/shared/FavoritesCard.vue
index bda547ea..874d8237 100644
--- a/src/components/shared/FavoritesCard.vue
+++ b/src/components/shared/FavoritesCard.vue
@@ -21,12 +21,12 @@
         </div>
         <div class="info">
             <div class="rhelp playlist">
-                <span class="help">PLAYLIST</span>
+                <span class="help">{{ $t('FavoritesCard.PlaylistUpper') }}</span>
                 <span class="time">{{ item.time }}</span>
             </div>
-            <div class="title">Favorite Tracks</div>
+            <div class="title">{{ $t('FavoritesCard.FavoriteTracks') }}</div>
             <div class="fcount">
-                <b>{{ item.count + ` Track${item.count == 1 ? '' : 's'}` }}</b>
+                <b>{{ $t('Common.TrackCount', {count: item.count}, item.count) }}</b>
             </div>
         </div>
     </RouterLink>
diff --git a/src/components/shared/FolderCard.vue b/src/components/shared/FolderCard.vue
index 5caa7b6c..e3227ec1 100644
--- a/src/components/shared/FolderCard.vue
+++ b/src/components/shared/FolderCard.vue
@@ -26,7 +26,7 @@
       {{ name(folder.path) }}
     </div>
     <div class="rtcount">
-      <b>{{ folder.count }} Track{{ folder.count == 1 ? "" : "s" }}</b>
+      <b>{{ $t('Common.TrackCount', {count: folder.count}, folder.count) }}</b>
     </div>
   </RouterLink>
 </template>
diff --git a/src/components/shared/GenericTrackPagination.vue b/src/components/shared/GenericTrackPagination.vue
index 4cbb379b..6ab54cf4 100644
--- a/src/components/shared/GenericTrackPagination.vue
+++ b/src/components/shared/GenericTrackPagination.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="v-scroll-page" :class="{ isSmall }" style="height: 100%">
-        <NoItems :flag="!tracks.length" :title="'No tracks'" :description="desc" :icon="noitemsicon" />
+        <NoItems :flag="!tracks.length" :title="$t('Common.NoTracks')" :description="desc" :icon="noitemsicon" />
         <DynamicScroller
             id="album-scroller"
             style="height: 100%"
diff --git a/src/components/shared/LoginUserCard.vue b/src/components/shared/LoginUserCard.vue
index d0e2f161..74748f31 100644
--- a/src/components/shared/LoginUserCard.vue
+++ b/src/components/shared/LoginUserCard.vue
@@ -2,7 +2,7 @@
     <div class="loginuser rounded-sm" :class="{ selected }">
         <Avatar :name="user.username" />
         <div class="username">
-            {{ (selected ? `Hi ` : '') + user.username }}
+            {{ (selected ? $t('Common.HiSpace') : '') + user.username }}
         </div>
     </div>
 </template>
diff --git a/src/components/shared/LyricsButton.vue b/src/components/shared/LyricsButton.vue
index 0e74a8f1..d71e902f 100644
--- a/src/components/shared/LyricsButton.vue
+++ b/src/components/shared/LyricsButton.vue
@@ -1,6 +1,6 @@
 <template>
-    <button title="Lyrics" class="lyrics" :class="{ showStatus: lyrics.exists }" @click="handleClick">
-        <LyricsSvg /> {{ showText ? 'Lyrics' : '' }}
+    <button :title="$t('Common.Lyrics')"" class="lyrics" :class="{ showStatus: lyrics.exists }" @click="handleClick">
+        <LyricsSvg /> {{ showText ? $t('Common.Lyrics')  : '' }}
     </button>
 </template>
 
diff --git a/src/components/shared/MasterFlag.vue b/src/components/shared/MasterFlag.vue
index 7714a436..9b60b8e7 100644
--- a/src/components/shared/MasterFlag.vue
+++ b/src/components/shared/MasterFlag.vue
@@ -2,7 +2,7 @@
   <span
     v-if="bitrate > 1024"
     class="master-flag"
-    :title="!text ? 'Master audio bitrate - ' + `${bitrate} Kbps` : ''"
+    :title="!text ? $t('MasterFlag.MasterAudioBitrate') + `${bitrate} Kbps` : ''"
     :style="{
       backgroundColor: bg_color ? (fill ? bg_color : 'transparent') : 'rgba(184, 108, 21, 0.281)',
       color: text_color ? (fill ? text_color : '') : 'rgb(255, 153, 0)',
@@ -13,6 +13,7 @@
 </template>
 
 <script setup lang="ts">
+
 defineProps<{
   bitrate: number;
   text?: string;
diff --git a/src/components/shared/PlayBtnRect.vue b/src/components/shared/PlayBtnRect.vue
index 44f1af76..d55466da 100644
--- a/src/components/shared/PlayBtnRect.vue
+++ b/src/components/shared/PlayBtnRect.vue
@@ -10,7 +10,7 @@
         @click="playFrom(source)"
     >
         <playBtnSvg />
-        <div class="text">Play</div>
+        <div class="text">{{ $t('Common.Play') }}</div>
     </button>
 </template>
 
diff --git a/src/components/shared/SeeAll.vue b/src/components/shared/SeeAll.vue
index a35bb51a..5be355ac 100644
--- a/src/components/shared/SeeAll.vue
+++ b/src/components/shared/SeeAll.vue
@@ -1,7 +1,7 @@
 <template>
     <span class="see-all">
         <RouterLink :to="route">
-            <b>{{ text || `SEE ALL` }}</b>
+            <b>{{ text || $t('Common.SeeAll').toUpperCase() }}</b>
         </RouterLink>
     </span>
 </template>
diff --git a/src/components/shared/SongItem.vue b/src/components/shared/SongItem.vue
index a682aaf8..6b4add5d 100644
--- a/src/components/shared/SongItem.vue
+++ b/src/components/shared/SongItem.vue
@@ -24,7 +24,7 @@
         </div>
 
         <TrackAlbum
-            :album="track.album || 'Unknown'"
+            :album="track.album || $t('Common.Unknown')"
             :albumhash="track.albumhash || ''"
             :hide_album="hide_album || false"
         />
diff --git a/src/components/shared/SongItem/TrackAlbum.vue b/src/components/shared/SongItem/TrackAlbum.vue
index 23851c8c..14054931 100644
--- a/src/components/shared/SongItem/TrackAlbum.vue
+++ b/src/components/shared/SongItem/TrackAlbum.vue
@@ -6,7 +6,7 @@
         :to="{
             name: 'AlbumView',
             params: {
-                albumhash: albumhash || 'Unknown',
+                albumhash: albumhash || $t('Common.Unknown'),
             },
         }"
     >
@@ -15,6 +15,7 @@
 </template>
 
 <script setup lang="ts">
+
 defineProps<{
     hide_album: boolean
     albumhash: string
diff --git a/src/components/shared/TrackItem.vue b/src/components/shared/TrackItem.vue
index db270259..971279bd 100644
--- a/src/components/shared/TrackItem.vue
+++ b/src/components/shared/TrackItem.vue
@@ -35,7 +35,7 @@
         <div class="float-buttons flex">
             <div
                 class="fav-icon"
-                :title="is_fav ? 'Add to favorites' : 'Remove from favorites'"
+                :title="is_fav ? $t('TrackItem.AddToFavorites') : $t('TrackItem.RemoveFromFavorites')"
                 @click.stop="() => addToFav(track.trackhash)"
             >
                 <HeartSvg :state="is_fav" :no_emit="true" />
@@ -43,7 +43,7 @@
             <div
                 v-if="isQueueTrack"
                 class="remove-track"
-                title="Remove from queue"
+                :title="$t('TrackItem.RemoveFromQueue')"
                 @click.stop="player.removeByIndex(index)"
             >
                 <DelSvg />
diff --git a/src/context_menus/album.ts b/src/context_menus/album.ts
index c68946a2..efd20224 100644
--- a/src/context_menus/album.ts
+++ b/src/context_menus/album.ts
@@ -11,6 +11,9 @@ import { addAlbumToPlaylist } from '@/requests/playlists'
 import { AddToQueueIcon, DeleteIcon, PlayNextIcon, PlusIcon } from '@/icons'
 import { Album, Collection, Option, Playlist, Track } from '@/interfaces'
 import { get_find_on_social, getAddToCollectionOptions, getAddToPlaylistOptions } from './utils'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 export default async (album?: Album) => {
     const albumStore = useAlbum()
@@ -20,7 +23,7 @@ export default async (album?: Album) => {
     }
 
     const play_next = <Option>{
-        label: 'Play next',
+        label: t('Menus.Common.PlayNext'),
         action: async () => {
             let tracks: Track[] = []
 
@@ -36,7 +39,7 @@ export default async (album?: Album) => {
     }
 
     const add_to_queue = <Option>{
-        label: 'Add to queue',
+        label: t('Menus.Common.AddToQueue'),
         action: async () => {
             let tracks: Track[] = []
 
@@ -57,7 +60,7 @@ export default async (album?: Album) => {
     }
 
     const add_to_playlist: Option = {
-        label: 'Add to Playlist',
+        label: t('Menus.Common.AddToPlaylist'),
         children: () =>
             getAddToPlaylistOptions(AddToPlaylistAction, {
                 albumhash: album.albumhash,
@@ -71,7 +74,7 @@ export default async (album?: Album) => {
     }
 
     const add_to_page: Option = {
-        label: 'Add to Collection',
+        label: t('Menus.Common.AddToCollection'),
         children: () =>
             getAddToCollectionOptions(addToPageAction, {
                 collection: null,
@@ -83,7 +86,7 @@ export default async (album?: Album) => {
     }
 
     const remove_from_page: Option = {
-        label: 'Remove item',
+        label: t('Menus.Common.RemoveFromCollection'),
         action: async () => {
             const success = await addOrRemoveItemFromCollection(
                 parseInt(router.currentRoute.value.params.collection as string),
diff --git a/src/context_menus/artist.ts b/src/context_menus/artist.ts
index 99eb9756..aec61607 100644
--- a/src/context_menus/artist.ts
+++ b/src/context_menus/artist.ts
@@ -10,10 +10,13 @@ import { addArtistToPlaylist } from '@/requests/playlists'
 import { AddToQueueIcon, DeleteIcon, PlayNextIcon, PlusIcon } from '@/icons'
 import { Artist, Collection, Option, Playlist } from '@/interfaces'
 import { getAddToCollectionOptions, getAddToPlaylistOptions, get_find_on_social } from './utils'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 export default async (artisthash: string, artistname: string) => {
     const play_next = <Option>{
-        label: 'Play next',
+        label: t('Menus.Common.PlayNext'),
         action: () => {
             getArtistTracks(artisthash).then(tracks => {
                 const store = useTracklist()
@@ -24,7 +27,7 @@ export default async (artisthash: string, artistname: string) => {
     }
 
     const add_to_queue = <Option>{
-        label: 'Add to queue',
+        label: t('Menus.Common.AddToQueue'),
         action: () => {
             getArtistTracks(artisthash).then(tracks => {
                 const store = useTracklist()
@@ -40,7 +43,7 @@ export default async (artisthash: string, artistname: string) => {
     }
 
     const add_to_playlist: Option = {
-        label: 'Add to Playlist',
+        label: t('Menus.Common.AddToPlaylist'),
         children: () =>
             getAddToPlaylistOptions(AddToPlaylistAction, {
                 artisthash,
@@ -61,7 +64,7 @@ export default async (artisthash: string, artistname: string) => {
     }
 
     const add_to_page: Option = {
-        label: 'Add to Collection',
+        label: t('Menus.Common.AddToCollection'),
         children: () =>
             getAddToCollectionOptions(addToCollectionAction, {
                 collection: null,
@@ -73,7 +76,7 @@ export default async (artisthash: string, artistname: string) => {
     }
 
     const remove_from_collection: Option = {
-        label: 'Remove item',
+        label: t('Menus.Common.RemoveFromCollection'),
         action: async () => {
             const success = await addOrRemoveItemFromCollection(
                 parseInt(router.currentRoute.value.params.collection as string),
diff --git a/src/context_menus/folder.ts b/src/context_menus/folder.ts
index 27aeec87..c5a38ea3 100644
--- a/src/context_menus/folder.ts
+++ b/src/context_menus/folder.ts
@@ -8,12 +8,15 @@ import useTracklist from "@/stores/queue/tracklist";
 
 import { addFolderToPlaylist } from "@/requests/playlists";
 import { getAddToPlaylistOptions } from "./utils";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 export default async (path: string) => {
   const modal = useModal();
 
   const play_next = <Option>{
-    label: "Play next",
+    label: t('Menus.Common.PlayNext'),
     action: () => {
       getTracksInPath(path).then((tracks) => {
         const store = useTracklist();
@@ -24,7 +27,7 @@ export default async (path: string) => {
   };
 
   const add_to_queue = <Option>{
-    label: "Add to Queue",
+    label: t('Menus.Common.AddToQueue'),
     action: () => {
       getTracksInPath(path).then((tracks) => {
         const store = useTracklist();
@@ -40,7 +43,7 @@ export default async (path: string) => {
   };
 
   const add_to_playlist = <Option>{
-    label: "Add to Playlist",
+    label: t('Menus.Common.AddToPlaylist'),
     children: () =>
       getAddToPlaylistOptions(AddToPlaylistAction, {
         path,
diff --git a/src/context_menus/playlist.ts b/src/context_menus/playlist.ts
index f06eecd7..22d9bebf 100644
--- a/src/context_menus/playlist.ts
+++ b/src/context_menus/playlist.ts
@@ -1,8 +1,11 @@
+import { useT } from "@/i18n";
 import { Option } from "../interfaces";
 
+const { t } = useT();
+
 export default async () => {
   const deletePlaylist: Option = {
-    label: "Delete playlist",
+    label: t('Menus.PlayList.RemoveFromPlaylist'),
     critical: true,
     action: () => {
       console.log("delete playlist");
@@ -10,14 +13,14 @@ export default async () => {
   };
 
   const playNext: Option = {
-    label: "Play next",
+    label: t('Menus.Common.PlayNext'),
     action: () => {
       console.log("play next");
     },
   };
 
   const addToQueue: Option = {
-    label: "Add to queue",
+    label: t('Menus.Common.AddToQueue'),
     action: () => {
       console.log("add to queue");
     },
diff --git a/src/context_menus/queue.ts b/src/context_menus/queue.ts
index 95b4aabd..04670055 100644
--- a/src/context_menus/queue.ts
+++ b/src/context_menus/queue.ts
@@ -7,21 +7,24 @@ import { Option, Playlist } from "@/interfaces";
 import { getAddToPlaylistOptions } from "./utils";
 import { addTracksToPlaylist } from "@/requests/playlists";
 import { DeleteIcon, PlaylistIcon, PlusIcon } from "@/icons";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 function getQueueName(from: From) {
   switch (from.type) {
     case FromOptions.album:
       return from.name;
     case FromOptions.artist:
-      return `This is ${from.artisthash}`;
+      return t('Menus.Queue.ArtistName', {hash: from.artisthash});
     case FromOptions.folder:
       return from.name;
     case FromOptions.playlist:
-      return `${from.name} 2.0`;
+      return t('Menus.Queue.PlaylistName', {name: from.name});
     case FromOptions.search:
-      return `Search results for ${from.query}`;
+      return t('Menus.Queue.SearchName', {query: from.query});
     case FromOptions.favorite:
-      return `Favorites`;
+      return t('Menus.Queue.FavoritesName');
     default:
       return "";
   }
@@ -31,7 +34,7 @@ export default async () => {
   const store = useTracklist();
 
   const clearQueue: Option = {
-    label: "Clear queue",
+    label: t('Menus.Queue.ClearQueue'),
     action: () => {
       useQueue().clearQueue();
     },
@@ -44,7 +47,7 @@ export default async () => {
   };
 
   const addToPlaylist: Option = {
-    label: "Add queue to playlist",
+    label: t('Menus.Queue.AddQueueToPlaylist'),
     children: () => getAddToPlaylistOptions(AddToPlaylistAction, {
       trackhash: store.tracklist.map((t) => t.trackhash).join(","),
       playlist_name: getQueueName(store.from),
diff --git a/src/context_menus/track.ts b/src/context_menus/track.ts
index 475161e3..0d89eb87 100644
--- a/src/context_menus/track.ts
+++ b/src/context_menus/track.ts
@@ -11,6 +11,9 @@ import usePlaylistStore from '@/stores/pages/playlist'
 import useQueueStore from '@/stores/queue'
 import useTracklist from '@/stores/queue/tracklist'
 import { getAddToPlaylistOptions, get_find_on_social } from './utils'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 /**
  * Returns a list of context menu items for a track.
@@ -60,7 +63,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const add_to_playlist: Option = {
-        label: 'Add to Playlist',
+        label: t('Menus.Common.AddToPlaylist'),
         children: () =>
             getAddToPlaylistOptions(AddToPlaylistAction, {
                 trackhash: track.trackhash,
@@ -70,7 +73,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const add_to_q: Option = {
-        label: 'Add to Queue',
+        label: t('Menus.Common.AddToQueue'),
         action: () => {
             useTracklist().addTrack(track)
         },
@@ -78,7 +81,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const play_next: Option = {
-        label: 'Play next',
+        label: t('Menus.Common.PlayNext'),
         action: () => {
             useQueueStore().playTrackNext(track)
         },
@@ -86,7 +89,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const go_to_folder: Option = {
-        label: 'Go to Folder',
+        label: t('Menus.Track.GoToFolder'),
         action: () => {
             Router.push({
                 name: Routes.folder,
@@ -97,7 +100,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const go_to_artist: Option = {
-        label: `Go to Artist`,
+        label: t('Menus.Track.GoToArtist'),
         icon: ArtistIcon,
         action: () => {
             track_artists.length == 1
@@ -114,7 +117,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const open_in_explorer: Option = {
-        label: 'Open in files',
+        label: t('Menus.Track.OpenInFiles'),
         action: () => {
             openInFiles(track.filepath || track.folder || '')
         },
@@ -122,7 +125,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     const go_to_album: Option = {
-        label: 'Go to Album',
+        label: t('Menus.Track.GoToAlbum'),
         action: () => {
             Router.push({
                 name: Routes.album,
@@ -133,7 +136,7 @@ export default async (track: Track): Promise<Option[]> => {
     }
 
     // const del_track: Option = {
-    //   label: "Delete Track",
+    //   label: t('Menus.Track.DeleteTrack'),
     //   action: () => console.log("Delete Track"),
     //   icon: DeleteIcon,
     //   critical: true,
@@ -141,7 +144,7 @@ export default async (track: Track): Promise<Option[]> => {
 
     const getRemoveFromPlaylistOption = () =>
         <Option>{
-            label: 'Remove From Playlist',
+            label: t('Menus.Common.RemoveFromPlaylist'),
             action: () => {
                 removeTracks(parseInt(route.params.pid as string), [
                     { trackhash: track.trackhash, index: track.index },
@@ -173,7 +176,7 @@ export default async (track: Track): Promise<Option[]> => {
 
     if (route.name === Routes.nowPlaying) {
         options.splice(0, 0, <Option>{
-            label: 'Remove from Queue',
+            label: t('Menus.Common.RemoveFromQueue'),
             action: () => {
                 useTracklist().removeByIndex(track.index)
             },
diff --git a/src/context_menus/utils.ts b/src/context_menus/utils.ts
index d646f39a..15c02345 100644
--- a/src/context_menus/utils.ts
+++ b/src/context_menus/utils.ts
@@ -5,6 +5,9 @@ import { SearchIcon } from '@/icons'
 import { Album, Collection, Option, Playlist } from '@/interfaces'
 import { getAllCollections } from '@/requests/collections'
 import { getAllPlaylists } from '@/requests/playlists'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 export const separator: Option = {
     type: 'separator',
@@ -12,7 +15,7 @@ export const separator: Option = {
 
 export function get_new_playlist_option(new_playlist_modal_props: any = {}): Option {
     return {
-        label: 'New playlist',
+        label: t('Menus.Utils.NewPlaylist'),
         action: () => {
             modal().showNewPlaylistModal(new_playlist_modal_props)
         },
@@ -21,7 +24,7 @@ export function get_new_playlist_option(new_playlist_modal_props: any = {}): Opt
 
 export function get_new_collection_option(new_collection_modal_props: any = {}): Option {
     return {
-        label: 'New Collection',
+        label: t('Menus.Utils.NewCollection'),
         action: () => {
             modal().showCollectionModal(new_collection_modal_props)
         },
@@ -101,7 +104,7 @@ export const get_find_on_social = (page = 'album', query = '', album?: Album) =>
     const search_term = query ? query : is_album ? getAlbumSearchTerm() : useArtist().info.name
 
     return <Option>{
-        label: 'Search on',
+        label: t('Menus.Utils.SearchOn'),
         icon: SearchIcon,
         children: async () => [
             {
diff --git a/src/helpers/usePlayFrom.ts b/src/helpers/usePlayFrom.ts
index ffdea2fd..467890eb 100644
--- a/src/helpers/usePlayFrom.ts
+++ b/src/helpers/usePlayFrom.ts
@@ -14,6 +14,9 @@ import { getArtistTracks } from '@/requests/artists'
 import { getFavTracks } from '@/requests/favorite'
 import { getFiles } from '@/requests/folders'
 import { getPlaylist } from '@/requests/playlists'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 export async function utilPlayFromArtist(index: number = 0) {
     const queue = useQueue()
@@ -43,7 +46,7 @@ export async function playFromAlbumCard(albumhash: string, albumname: string) {
     const tracks = await getAlbumTracks(albumhash)
 
     if (tracks.length === 0) {
-        useToast().showNotification('Album tracks not found', NotifType.Error)
+        useToast().showNotification(t('UsePlayFrom.AlbumTracksNotFound'), NotifType.Error)
         return
     }
 
@@ -57,7 +60,7 @@ export async function playFromArtistCard(artisthash: string, artistname: string)
     const tracks = await getArtistTracks(artisthash)
 
     if (tracks.length === 0) {
-        useToast().showNotification('Artist tracks not found', NotifType.Error)
+        useToast().showNotification(t('UsePlayFrom.ArtistTracksNotFound'), NotifType.Error)
         return
     }
 
@@ -73,7 +76,7 @@ export async function playFromFolderCard(folderpath: string) {
     const tracks = data.tracks
 
     if (tracks.length === 0) {
-        useToast().showNotification('Folder tracks not found', NotifType.Error)
+        useToast().showNotification(t('UsePlayFrom.FolderTracksNotFound'), NotifType.Error)
         return
     }
 
diff --git a/src/i18n.ts b/src/i18n.ts
new file mode 100644
index 00000000..073b0a62
--- /dev/null
+++ b/src/i18n.ts
@@ -0,0 +1,29 @@
+import { Composer, createI18n } from "vue-i18n";
+
+import en from './locales/en_US.json';
+import it from './locales/it_IT.json';
+import ko from './locales/ko.json';
+import { useCookies } from "@vueuse/integrations/useCookies";
+
+const userLocale = navigator.language;
+export const supportedLocales = ['en_US', 'it_IT', 'ko'];
+const fallbackLocale = 'en_US';
+const cookies = useCookies();
+export const locale = supportedLocales.includes(userLocale) ? userLocale : fallbackLocale;
+
+const i18n = createI18n({
+  legacy: false,
+  locale: cookies.get('locale') ? cookies.get('locale') : locale,
+  globalInjection: true,
+  messages: {
+    en_US: en,
+    it_IT: it,
+    ko: ko
+  }
+});
+
+export function useT(){
+    return i18n.global;
+}
+
+export default i18n;
\ No newline at end of file
diff --git a/src/interfaces.ts b/src/interfaces.ts
index 4a227052..6046bbd8 100644
--- a/src/interfaces.ts
+++ b/src/interfaces.ts
@@ -325,6 +325,7 @@ export interface UserSimplified {
 export interface User extends UserSimplified {
     image: string
     roles: string[]
+    lang?: string
 }
 
 export interface StatItem {
diff --git a/src/locales/en_US.json b/src/locales/en_US.json
new file mode 100644
index 00000000..2e7c4016
--- /dev/null
+++ b/src/locales/en_US.json
@@ -0,0 +1,868 @@
+{
+  "Accounts": {
+    "Admin": "Admin",
+    "AdminDesc": "Can do anything",
+    "AllUsers": "All users",
+    "EnableGuestAccess": "Enable guest access",
+    "EnableGuestAccessDesc": "Allow users to access the site without an account",
+    "NewUser": "New user",
+    "NoSelfDelete": "Sorry! You cannot delete yourself",
+    "ShowUsersOnLogin": "Show users on login",
+    "ShowUsersOnLoginDesc": "Show a list of users on your server when logging in"
+  },
+  "AlbumView": {
+    "AlbumBy": "Album by ",
+    "DiskNumber": "Disc {num}",
+    "GenreBanner": {
+      "GenreDoesNotExist": "No Genres",
+      "GenreExists": "Genres"
+    },
+    "PlayDisc": "Play Disc",
+    "TrackCount": "Track | Tracks"
+  },
+  "ArtistCard": {
+    "TrackCount": "{count} Track | {count} Tracks"
+  },
+  "ArtistView": {
+    "LoadMore": "Load More",
+    "NoTracks": "No tracks",
+    "RepeatOptions": {
+      "All": "Repeat all",
+      "None": "No repeat",
+      "One": "Repeat one"
+    },
+    "Title": "Artist"
+  },
+  "AuthLogin": {
+    "Back": "Back",
+    "BackToSelection": "Back to selection",
+    "ContinueAsGuest": "Or continue as guest",
+    "EnterPassword": "Enter password",
+    "EnterUsername": "Enter username",
+    "WelcomeBack": "Welcome back"
+  },
+  "BottomBar": {
+    "Favorite": "Favorite",
+    "GoToNowPlaying": "Go to Now Playing",
+    "PlaceholderArtist": "Welcome to Swing Music",
+    "PlaceholderTitle": "Hello there",
+    "RepeatOptions": {
+      "All": "Repeat all",
+      "None": "No repeat",
+      "One": "Repeat one"
+    },
+    "Shuffle": "Shuffle"
+  },
+  "Bubbles": {
+    "DropHere": "DROP TRACKS HERE"
+  },
+  "CardList": {
+    "SortBy": "Sort by",
+    "SortByOptions": {
+      "AlbumArtists": "Artist",
+      "CreatedDate": "Date added",
+      "Date": "Year Released",
+      "Duration": "Duration",
+      "LastPlayed": "Last played",
+      "Name": "Name",
+      "NoOfAlbums": "No. of albums",
+      "PlayCount": "Plays",
+      "PlayDuration": "Play duration",
+      "Title": "Title",
+      "TrackCount": "No. of tracks"
+    }
+  },
+  "ChartItem": {
+    "ArtistPlays": "{count} track plays"
+  },
+  "ChartItemGroup": {
+    "FetchingData": "fetching data...",
+    "NoDataFound": "No {per} data found for this period"
+  },
+  "Charts": {
+    "ChartsDescription": "Your top artists, albums, and tracks",
+    "ChartsTitle": "Charts"
+  },
+  "Common": {
+    "Activate": "Activate",
+    "Album": "Album | Albums",
+    "AlbumArtist": "Album Artist",
+    "All": "All",
+    "AppTitle": "Swing Music",
+    "Appearance": "Appearance",
+    "Appearances": "Appearances",
+    "Artist": "Artist | Artists",
+    "Ascending": "Ascending",
+    "Autodetect": "autodetect",
+    "Backup": "Backup",
+    "Bitrate": "Bitrate",
+    "BuiltBy": "built by @cwilvx ↗",
+    "Change": "Change",
+    "Compilations": "Compilation | Compilations",
+    "Configure": "Configure",
+    "ConfirmPass": "Confirm Password",
+    "Connect": "Connect",
+    "Continue": "Continue",
+    "Create": "Create",
+    "CreateAccount": "Create account",
+    "DateAdded": "Date Added",
+    "Default": "Default",
+    "Delete": "Delete",
+    "Descending": "Descending",
+    "Details": "Details",
+    "Disc": "Disc",
+    "Discography": "Discography {artist}",
+    "Disconnect": "Disconnect",
+    "Duration": "Duration",
+    "FileName": "File Name",
+    "Finish": "Finish",
+    "Folders": "Folders",
+    "HiSpace": "Hi ",
+    "Image": "Image",
+    "LastPlayed": "Last Played",
+    "Library": "Library",
+    "LogIn": "Login",
+    "LogOut": "Log out",
+    "Lyrics": "Lyrics",
+    "Modify": "Modify",
+    "New": "New",
+    "NoResults": "No results",
+    "NoSearchResults": "We can't find any results for your search.",
+    "NoTrackResults": "No track results",
+    "NoTracks": "No tracks",
+    "NotificationError": "An error occured!",
+    "NotificationErrorWithArg": "Failed: {error}",
+    "NotificationFunnyError": "Something funny happened!",
+    "NowPlaying": "Now Playing",
+    "Other": "Other",
+    "Password": "Password",
+    "Periods": {
+      "AllTime": "All Time",
+      "Month": "Month | Months",
+      "MonthShort": "mo",
+      "OnceShort": "once",
+      "Week": "Week | Weeks",
+      "Year": "Year | Years",
+      "YearShort": "yr"
+    },
+    "Pinned": "Pinned",
+    "Play": "Play",
+    "PlayCount": "Play Count",
+    "PlayDuration": "Play Duration",
+    "Playlist": "Playlist",
+    "Playlists": "Playlists",
+    "Plugins": "Plugins",
+    "Recents": "Recents",
+    "ReleaseDate": "Release Date",
+    "Rescan": "Rescan",
+    "Saving": "Saving",
+    "Search": "Search",
+    "SearchResults": "Search Results",
+    "SeeAll": "See All",
+    "Settings": "Settings",
+    "SimilarArtists": "Similar artists",
+    "Singles": "EP & Singles",
+    "SwingMusic": "Swing Music",
+    "Title": "Title",
+    "TopResult": "Top Result",
+    "Track": "Track | Tracks",
+    "TrackCount": "{count} track | {count} tracks",
+    "Unknown": "Unknown",
+    "Update": "Update",
+    "Username": "Username",
+    "added": "added",
+    "album": "album | albums",
+    "artist": "artist | artists",
+    "experimental": "experimental",
+    "mix": "mix | mixes",
+    "new": "new",
+    "removed": "removed",
+    "selected": "selected",
+    "top": "top",
+    "track": "track | tracks",
+    "update": "update",
+    "upload": "upload"
+  },
+  "ConfirmModal": {
+    "Cancel": "Cancel",
+    "Delete": "Delete"
+  },
+  "Content": {
+    "SettingsDesc": "Customize your settings and preferences"
+  },
+  "CrudPage": {
+    "CollectionName": "Collection name",
+    "CollectionTitle": " Collection",
+    "Create": "Create",
+    "CreateNotification": "New collection created",
+    "DeleteButton": "Yes, Delete",
+    "DeleteDescription": "Are you sure you want to delete this collection?",
+    "DeleteNotification": "Collection deleted",
+    "DeleteTitle": "Delete",
+    "Description": "Description",
+    "NewTitle": "New",
+    "Update": "Update",
+    "UpdateNotification": "Collection updated",
+    "UpdateTitle": "Update"
+  },
+  "DropDown": {
+    "SortByUppercase": "SORT BY {title} {order}"
+  },
+  "Favorites": {
+    "Album": "Album"
+  },
+  "FavoritesCard": {
+    "FavoriteTracks": "Favorite Tracks",
+    "PlaylistUpper": "PLAYLIST"
+  },
+  "FolderView": {
+    "FileCount": "File | Files"
+  },
+  "HomeView": {
+    "Browse": {
+      "BrowseList": {
+        "Albums": "Albums",
+        "Artists": "Artists",
+        "FavAlbums": "Fav. albums",
+        "FavArtists": "Fav. artists",
+        "FavTracks": "Fav. tracks",
+        "Favorites": "Favorites",
+        "Folders": "Folders",
+        "Playlists": "Playlists",
+        "Stats": "Stats"
+      },
+      "Title": "Browse Library"
+    },
+    "Greetings": {
+      "afternoon": "Good afternoon {name}",
+      "dawn": "Hey there early bird",
+      "evening": "Good evening {name}",
+      "midnight": "Hey there night owl",
+      "morning": "Good morning {name}"
+    },
+    "Title": "Home",
+    "title": "Home"
+  },
+  "Languages": {
+    "ChooseLang": "Choose your preferred language",
+    "WarnAppReload": "(setting the language triggers an app reload)",
+    "en_US": "🇺🇸 English (United States)",
+    "it_IT": "🇮🇹 Italian (Italy)",
+    "ko": "Korean"
+  },
+  "LeftSidebar": {
+    "FileTypeBitrate": "file type • bitrate",
+    "NavItems": {
+      "Favorites": "Favorites",
+      "Folder": "Folders",
+      "Home": "Home",
+      "Playlists": "Playlists",
+      "Search": "Search",
+      "Settings": "Settings"
+    }
+  },
+  "MasterFlag": {
+    "MasterAudioBitrate": "Master audio bitrate - "
+  },
+  "Menus": {
+    "Album": {
+    },
+    "Artist": {
+      "PlayNext": "Play next"
+    },
+    "Common": {
+      "AddToCollection": "Add to Collection",
+      "AddToPlaylist": "Add to Playlist",
+      "AddToQueue": "Add to queue",
+      "PlayNext": "Play next",
+      "RemoveFromCollection": "Remove item",
+      "RemoveFromPlaylist": "Remove From Playlist",
+      "RemoveFromQueue": "Remove from Queue"
+    },
+    "PlayList": {
+      "RemoveFromPlaylist": "Remove from playlist"
+    },
+    "Queue": {
+      "AddQueueToPlaylist": "Add queue to playlist",
+      "ArtistName": "This is {hash}",
+      "ClearQueue": "Clear queue",
+      "FavoritesName": "Favorites",
+      "PlaylistName": "{name} 2.0",
+      "SearchName": "Search results for {query}"
+    },
+    "Track": {
+      "DeleteTrack": "Delete Track",
+      "GoToAlbum": "Go to Album",
+      "GoToArtist": "Go to Artist",
+      "GoToFolder": "Go to Folder",
+      "OpenInFiles": "Open in files"
+    },
+    "Utils": {
+      "NewCollection": "New Collection",
+      "NewPlaylist": "New playlist",
+      "SearchOn": "Search on"
+    }
+  },
+  "Mixes": {
+    "Radio": "Radio",
+    "SaveMix": "Save Mix",
+    "SavedMix": "Saved Mix",
+    "track": "track | tracks"
+  },
+  "Modal": {
+    "DeletePlaylist": "Are you sure you want to permanently delete this playlist?",
+    "UpdatePlaylist": "Update Playlist"
+  },
+  "Nav": {
+    "ResetClient": "Reset client"
+  },
+  "NavTitles": {
+    "ArtistTracks": "Artist Tracks",
+    "NowPlaying": "Now Playing",
+    "Settings": "Settings"
+  },
+  "NewPlaylist": {
+    "CreateButton": "Create",
+    "NameNotEmpty": "Playlist name can't be empty",
+    "NamePlaceholder": "Type a name...",
+    "PlaylistName": "Playlist name",
+    "Title": "New Playlist"
+  },
+  "NowPlaying": {
+    "GoToAlbum": "Go to album",
+    "GoToPlaySource": "Go to play source",
+    "Queue": "Queue",
+    "UpNext": "Up Next"
+  },
+  "Onboarding": {
+    "CreateAccountDesc": "This account will be used to manage your server.",
+    "CreateAccountTitle": "Create account",
+    "ErrorPassDoNotMatch": "Passwords do not match",
+    "ErrorPassTooShort": "Password must be at least 8 characters",
+    "FilePicker": {
+      "Help": "Use (⌘/Ctrl or Shift) + Click to select multiple folders",
+      "Selected": "{sel} Selected",
+      "ThisFolderHelp": ". (this folder)"
+    },
+    "Finish": {
+      "ConfirmButton": "Click the button below to continue to your library.",
+      "Processing": "Swing Music is scanning your music folders. Please wait ...",
+      "TitleAlmostDone": "You're almost there!",
+      "TitleDone": "You're all set! 🎉"
+    },
+    "RootDirs": {
+      "AddFolders": "Add Folders",
+      "ErrorSelectRootFolder": "Please select a root directory",
+      "FolderSelected": "{n} folder selected | {n} folders selected",
+      "FolderSelectedDesc": "Select folder to scan for music",
+      "HomeDir": "Home directory",
+      "HomeDirDesc": "Scan all folders in ",
+      "SpecificFolder": "Specific directory",
+      "Title": "Configure music folders",
+      "TitleDesc": "Where do you want Swing Music to look for music?"
+    },
+    "Welcome": {
+      "GetStarted": "Get Started",
+      "Tagline": "Click the button below to let's create your account",
+      "Title": "Welcome to"
+    }
+  },
+  "Pairing": {
+    "ErrorPairingCode": "Error fetching pairing code. Error code: {res}",
+    "ScanQRCode": "Scan the QR code from the Swing Music app to pair with this server."
+  },
+  "PlaylistView": {
+    "AllTracks": "All Tracks",
+    "Edit": "Edit",
+    "LastUpdated": "Last Updated {date}"
+  },
+  "Profile": {
+    "AddUser": "Add user",
+    "ConfirmPassword": "Confirm password",
+    "HiUser": "Hi {user}",
+    "LangNotCurrentlySupported": "Language not currently supported",
+    "PasswordAction": "{action} password",
+    "PasswordMismatch": "Passwords do not match",
+    "SelectLanguage": "Insert the preferred language",
+    "SetLanguage": "Set language",
+    "Username": "Username"
+  },
+  "ProfileDropdown": {
+    "HiUser": "Hi {user}",
+    "QuickScan": "Quick scan"
+  },
+  "Requests": {
+    "Album": {
+      "AlbumNotCreatedYet": "Album not created yet!"
+    },
+    "Artists": {
+      "ArtistNotFound": "Artist not found"
+    },
+    "Collections": {
+      "AddOrRemCollSuccess": "{payload} {command} to page",
+      "CollectionAlreadyPresent": "{payload} already in collection"
+    },
+    "Playlists": {
+      "AddedToPlaylist": "Added to {name}",
+      "AlreadyExists": "That playlist already exists",
+      "BannerImageRemoved": "Banner image removed",
+      "BannerImageRemovedError": "Unable to remove banner image",
+      "CreatedSuccesfully": "Playlist created successfully!",
+      "Deleted": "Playlist deleted",
+      "ErrUnsupportedImage": "Failed: Unsupported image",
+      "NotFound": "Playlist not found",
+      "TrackAlreadyPresent": "Track already exists in playlist",
+      "TrackRemoved": "Tracks removed",
+      "TrackRemovedError": "Unable to remove tracks",
+      "Updated": "Playlist updated!"
+    },
+    "RootDirs": {
+      "ErrorAdding": "Error adding root dirs",
+      "ErrorRemoving": "Error removing root dirs",
+      "ScanError": "Error triggering scan",
+      "ScanStarted": "Rescan started",
+      "Success": "Root directories configured"
+    }
+  },
+  "RightSidebar": {
+    "BackToQueue": "back to queue",
+    "NoQueueDescription": "When you start playing songs, they will appear here.",
+    "NoQueueTitle": "No songs in queue",
+    "NowPlaying": "Now Playing",
+    "Shuffle": "Shuffle",
+    "SimilarTracks": "Similar Tracks"
+  },
+  "RootDirsPrompt": {
+    "HomeDir": "Home directory",
+    "HomeDirInfo": "Scan all folders in your home directory.",
+    "SpecificDir": "Specific directories",
+    "SpecificDirInfo": "Select folders to scan for music.",
+    "WhereToLook": "Where do you want to look for music?"
+  },
+  "Search": {
+    "BackToQueue": "Back to Queue",
+    "GoToSearch": "Go to Search",
+    "NoResultsDescription": "We can't find any results for your search.",
+    "NoResultsTitle": "No results",
+    "NoTracksTitle": "No tracks",
+    "SearchPlaceholder": "Start typing to search",
+    "TopResult": "Top Result",
+    "top": "Top"
+  },
+  "SearchInput": {
+    "BackToQueue": "back to queue",
+    "GoToSearch": "go to search"
+  },
+  "SetRootDirs": {
+    "AddAllChecked": "Add all checked",
+    "NoSubFolders": "No folders here. Click the \"Add this folder\" button below to select this location.",
+    "SelectThisFolder": "Add this folder"
+  },
+  "Settings": {
+    "About": {
+      "Developer": "Swing Music is a labor of love developed by {link} on GitHub. If you like this software, a star on GitHub would be nice. Hope you enjoy using it as much as I enjoy building it. 😁🤗",
+      "GetInTouchDescription": "If you like my work, and would like to say hi, I'd like to hear from you.",
+      "GetInTouchTitle": "Get in touch",
+      "LicenseDesc": "Manage your license key, subscription and authorized devices",
+      "LicenseDisplayName": "License and Subscription",
+      "LicenseTitle": "License",
+      "LinksContribute": "Contribute",
+      "LinksDocs": "Docs",
+      "LinksGitHub": "Star on GitHub",
+      "LinksIssue": "Report an issue",
+      "LinksTitle": "Links",
+      "SendEmail": "Send Email",
+      "Title": "About"
+    },
+    "Accounts": {
+      "Desc": "Login to the mobile client using QR code",
+      "Title": "Accounts"
+    },
+    "AppWidth": {
+      "Extend": "Full width",
+      "ExtendDesc": "Extend app to use all available screen width"
+    },
+    "Audio": {
+      "CrossfadeDuration": {
+        "Description": "Duration of the crossfade in seconds",
+        "Title": "Crossfade duration"
+      },
+      "LegacyStreaming": {
+        "Description": "Enable if you experience issues with playback",
+        "Title": "Use legacy streaming"
+      },
+      "Playback": "Playback",
+      "PlaybackDesc": "Settings related to audio playback",
+      "StreamingQuality": {
+        "1024Flac": "High (1024kbps) (FLAC)",
+        "128": "128kbps",
+        "320": "320kbps",
+        "640Flac": "Medium (640kbps) (FLAC)",
+        "96": "96kbps",
+        "Description": "Choose the streaming quality of the music",
+        "Original": "Original",
+        "Title": "Streaming quality"
+      },
+      "Title": "Audio",
+      "UseCrossfade": {
+        "Description": "Fade out the current track while fading in the next track",
+        "Title": "Enable crossfade"
+      },
+      "UseSilence": {
+        "Description": "Automatically skip silence between tracks",
+        "Title": "Silence padding removal"
+      }
+    },
+    "Backup": {
+      "BackupCount": "You have {count} backup(s) in your backup directory.",
+      "BackupSuccess": "Backup created",
+      "CollectionCount": "{count} collection",
+      "FavoriteCount": "{count} favorite | {count} favorites",
+      "PlaylistCount": "{count} playlist | {count} playlists",
+      "RestoreAllButton": "Restore All",
+      "RestoreBackup": "Restore Backup",
+      "RestoreButton": "Restore",
+      "ScrobbleCount": "{count} scrobble | {count} scrobbles",
+      "ThankYouMessage": "Thank you for sponsoring Swing Music!",
+      "Title": "Backup"
+    },
+    "Cancel": "Cancel",
+    "ContextChildren": {
+      "ShowMode": "Show right click menu dropdowns on"
+    },
+    "Experimental": "experimental",
+    "General": {
+      "AlbumInfoSettingsDesc": "Settings relating to album information",
+      "Albums": {
+        "AlbumAsSingles": {
+          "Description": "Require an album to have at least two tracks",
+          "Title": "Mark albums with one track as singles"
+        },
+        "CleanTitles": {
+          "Description": "Remove bracketed text from titles and process it separately if possible",
+          "Title": "Clean album titles"
+        },
+        "MergeAlbum": {
+          "Description": "All versions of the same album will be merged into one album",
+          "Title": "Merge album versions"
+        }
+      },
+      "ArtistSeparatorDesc": "Customize artist separators",
+      "Artists": {
+        "ArticleAwareDesc": "Ignore articles (e.g. The, A, An) when sorting artist names",
+        "ArticleAwareTitle": "Article aware sorting",
+        "SeparatorDesc": "These will be used to separate artists and album artists",
+        "SeparatorTitle": "Enter separators separated by a comma"
+      },
+      "ArtistsDesc": "Customize artist settings",
+      "BackupMainDesc": "Backup and restore your library data",
+      "Backups": {
+        "AutomaticBackups": {
+          "Description": "Automatically backup your data, every 6 hours",
+          "Title": "Automatic backups"
+        },
+        "BackupNow": {
+          "Description": "Backup directory: ~/swingmusic.backups",
+          "Title": "Backup now"
+        }
+      },
+      "CircularArtist": {
+        "Description": "Disable the default gradient layout and use a simple circular image",
+        "Title": "Simple artist page header"
+      },
+      "FolderListMode": {
+        "Title": "Display folders in list mode"
+      },
+      "MainSettingsDescription": "Settings for various parts of the user interface.",
+      "NowPlaying": {
+        "DisableNPTitle": "Hide album art from the left sidebar",
+        "FavoriteInline": {
+          "Description": "Show the favorite button next to the track duration",
+          "Title": "Show inline favorite icon"
+        },
+        "HighlightFavorite": {
+          "Description": "Always show the favorite button for favorited tracks",
+          "Title": "Highlight favorite tracks"
+        },
+        "OnTabTitle": {
+          "Description": "Replace current page info with Now Playing track info",
+          "Title": "Show Now Playing track on tab title"
+        }
+      },
+      "RootDirs": {
+        "EnablePeriodicScans": "Enable periodic scans",
+        "PeriodicScanInterval": "Periodic scan interval (minutes)",
+        "ShowPlaylistInFolders": {
+          "Description": "Browse playlists and favorites in folders screen (meant for mobile app)",
+          "Title": "Show playlists in folder view"
+        },
+        "UseWatchdog": "Watch root dirs for new music"
+      },
+      "Separators": {
+        "Description": "These will be used to separate artists and album artists",
+        "Title": "Enter separators separated by a comma"
+      },
+      "Sidebar": {
+        "Description": "CTRL + B",
+        "Title": "Toggle right sidebar"
+      },
+      "TrackInfoSettingsDesc": "Settings relating to track information",
+      "Tracks": {
+        "HideRemaster": {
+          "Description": "Remove remaster information from track titles if possible",
+          "Title": "Hide remaster info"
+        },
+        "ProcessFeatArtists": {
+          "Description": "Remove featured artists from titles and merge them with other artists",
+          "Title": "Featured artists"
+        },
+        "RemoveProd": {
+          "Description": "Remove 'prod.' from track titles",
+          "Title": "Hide 'prod.'"
+        }
+      },
+      "UseNoSidebarTitle": "Use no sidebar layout"
+    },
+    "License": {
+      "ActivateLicense": "{action} License",
+      "Amount": "Amount",
+      "AuthDevices": "Authorized Devices",
+      "AutoRenewOff": "Auto-renew off",
+      "CanceledAt": "Canceled ",
+      "CurrentlyUsed": "Instances currently using your license key ({cur}/{tot} active)",
+      "Expires": "Expires",
+      "GithubSponsorTitle": "GitHub Sponsor Benefits",
+      "GithubSponsors": "GitHub Sponsors",
+      "LastActivity": "Last activity: {time}",
+      "LicenseKey": {
+        "AlreadyHave": "Already got a license key?",
+        "Info": "License key info",
+        "Paste": "Paste your license key here:",
+        "Update": "Update your license key:"
+      },
+      "LogInToGithub": "Log in with GitHub",
+      "Manage": "Manage {lic} ↗",
+      "NewOrUpServerName": "{act} server name:",
+      "NoActiveSub": "No Active Subscription",
+      "NoActiveSubDesc": "Get a subscription to unlock all premium features.\n Use the link below to browse the available plans and benefits.",
+      "NoActivity": "No activity",
+      "NoGithubLogin": "Swing Music Premium is available to all our GitHub Sponsors. Log in with GitHub to get access.",
+      "RefreshStatus": "Refresh Status",
+      "Renewal": "Renewal",
+      "Revoke": "Revoke",
+      "SaveChanges": "Save Changes",
+      "SponsorOnGithub": "Sponsor on GitHub ❤️",
+      "Sponsorship": "Sponsorship",
+      "Status": "Status",
+      "Subscription": "Subscription",
+      "ThanksCustName": "Hello @{cust}! You have access to Swing Music Premium.",
+      "ThanksWithHearts": "Thank you for your support. ❤️❤️",
+      "Tier": "Tier",
+      "ViewPricing": "View Pricing"
+    },
+    "List": {
+      "RootNotConfigured": "Root directories not configured. Use the \"Configure\" button above to configure"
+    },
+    "MasterFlag": {
+      "Show": "Master flag"
+    },
+    "NowPlaying": {
+      "AlbumArt": "Show album art on the left sidebar",
+      "Description": "Settings relating to the current song",
+      "Title": "Now playing"
+    },
+    "NumberInput": {
+      "InvalidNumber": "Invalid number",
+      "UpdateFailed": "Failed to update",
+      "Updated": "Updated"
+    },
+    "Pairing": {
+      "Title": "Pair device"
+    },
+    "Plugins": {
+      "LastFM": {
+        "ApiKey": {
+          "Description": "instead of the Swing Music default to authenticate with Last.fm",
+          "Title": "Use custom API Key"
+        },
+        "ApiSecret": {
+          "Description": "instead of the Swing Music default to sign your scrobble submission",
+          "Title": "Use custom API Secret"
+        },
+        "Authorize": {
+          "Description": "Allow Swing Music to access your Last.fm account",
+          "Title": "Connect your account"
+        },
+        "Description": "Scrobble your music to Last.fm",
+        "Title": "Last.fm"
+      },
+      "Lyrics": {
+        "AutoDownload": {
+          "Description": "Automatically download missing lyrics when you are on the lyrics page",
+          "Title": "Auto download lyrics"
+        },
+        "OverrideLocal": {
+          "Description": "Automatically download lyrics even if unsynced lyrics are locally available",
+          "Title": "Override unsynced lyrics"
+        },
+        "ToggleLyrics": {
+          "Title": "Enable plugin"
+        },
+        "TrustCloud": {
+          "Desc": "Do not show lyrics unverified lyrics (premium required)",
+          "Title": "Only display verified lyrics"
+        }
+      },
+      "LyricsDescription": "Finds and displays lyrics from the internet."
+    },
+    "Profile": {
+      "Desc": "Manage your profile and login information",
+      "Title": "Profile"
+    },
+    "RootDirs": {
+      "Change": "Change your root directories",
+      "Current": "Current root directories",
+      "Description": "Settings relating to your root directories",
+      "Title": "Root directories"
+    },
+    "Save": "Save",
+    "ShowFolders": {
+      "As": "Show folders as"
+    },
+    "Sidebar": {
+      "UseSidebar": "Show right sidebar"
+    }
+  },
+  "Stores": {
+    "Auth": {
+      "GuestUserAdded": "Guest user added successfully!",
+      "ProfileUpdated": "Profile updated successfully!",
+      "UserAddedSucc": "User added successfully!",
+      "UserDeleted": "{user} deleted successfully!"
+    },
+    "Player": {
+      "AutoplayBlockedError": "Tap anywhere in the page and try again (autoplay blocked)",
+      "LoadErrorWithArg": "Can't load: {queue}",
+      "PlayerErrorWithArg": "Player Error: {msg}"
+    },
+    "Queue": {
+      "AddedTrack": "Added 1 track to queue"
+    },
+    "Tracklist": {
+      "AddTrackToQueue": "Added {n} track to queue | Added {n} tracks to queue"
+    }
+  },
+  "TrackItem": {
+    "AddToFavorites": "Add to favorites",
+    "RemoveFromFavorites": "Remove from favorites",
+    "RemoveFromQueue": "Remove from queue"
+  },
+  "UpNext": {
+    "NextUp": "Next up",
+    "PlayNextSong": "play next song"
+  },
+  "UpdatePlaylist": {
+    "CoverAction": "Click to {action} cover image",
+    "ImagePosition": "Adjust image position • {pos} %",
+    "Name": "Playlist name",
+    "SquareCover": "Show square cover image"
+  },
+  "UsePlayFrom": {
+    "AlbumTracksNotFound": "Album tracks not found",
+    "ArtistTracksNotFound": "Artist tracks not found",
+    "FolderTracksNotFound": "Folder tracks not found"
+  },
+  "Utils": {
+    "FormatTime": {
+      "Hour": "{hrs} hr | {hrs} hrs",
+      "Minute": "{mnt} minute | {mnt} minutes",
+      "Second": "{sec} Second | {sec} Seconds"
+    },
+    "PlayingFrom": {
+      "FavoriteTracks": "Favorite tracks",
+      "NoSource": "👻 No source",
+      "SearchFrom": "Search for: \"{source}\""
+    }
+  },
+  "Views": {
+    "AlbumViews": {
+      "MoreFrom": "More from {art}",
+      "OtherVersions": "Other versions",
+      "RelatedAlbums": "Related Albums"
+    },
+    "ArtistDiscography": {
+      "AllAlbums": "All Albums",
+      "Contributions": "Contributions",
+      "NoContributions": "No contributions",
+      "NoContributionsDesc": "No {type} found for {artist}"
+    },
+    "FavCardScroller": {
+      "Desc": "You have {nelem} favorited {type} | You have {nelem} favorited {type}s",
+      "Title": "Favorite {item}S"
+    },
+    "FavoriteTracks": {
+      "Description": "You have {n_tr} favorited track | You have {n_tr} favorited tracks",
+      "Title": "Favorite Tracks"
+    },
+    "Favorites": {
+      "CountStats": "{tra} Tracks • {alb} Albums • {art} Artists",
+      "Description": "You can add tracks, albums and artists to your favorites by clicking the heart icon",
+      "NoFavoritesFound": "No favorites found",
+      "Title": "Favorites"
+    },
+    "FolderView": {
+      "FolderIsEmpty": "Folder is empty",
+      "NoIndexedTracks": "The folder you are trying to access has no indexed tracks. Please add tracks to this folder and try again",
+      "NoResultFound": "No results found",
+      "NoTracksForQuery": "No tracks or folders in this immediate directory matched the query: {query}"
+    },
+    "Header": {
+      "TotalAlbumAndArtists": "You have {tot} {what} in your library"
+    },
+    "LyricView": {
+      "NoLyricsFoundFirst": "You don't have",
+      "NoLyricsFoundSecond": "the lyrics for this song",
+      "SearchOnline": "Search online",
+      "Searching": "Searching...",
+      "Unsynced": "unsynced"
+    },
+    "MixLisView": {
+    },
+    "MixListView": {
+      "MixesBasedOnListening": "{n} mixes • Based on artists you have been listening to",
+      "OtherMixes": "Other {type} mixes",
+      "SavedMixes": "Saved mixes",
+      "mixes": "mixes"
+    },
+    "MixView": {
+      "MixNotFound": "404: Mix not found"
+    },
+    "NotFound": {
+      "Error": "404! Page Not Found!"
+    },
+    "PlaylistList": {
+      "AllPlaylists": "All playlists",
+      "Description": "You have {n} playlists in your library",
+      "NoItemDescription": "You can create a playlist by right clicking on a track and selecting the \"Add to Playlist\" option",
+      "NoPlaylistsFound": "No playlists found",
+      "OtherPlaylists": "Other playlists",
+      "SearchPlaylist": "Search playlists",
+      "Title": "Playlists"
+    },
+    "PlaylistView": {
+      "AddMoreDesc": "Add tracks to this playlist by right clicking on a track and selecting \"add to playlist\"",
+      "NoTracks": "No tracks in this playlist"
+    },
+    "SearchView": {
+      "NoResults": "No {page} results",
+      "NoResultsDesc": "Results should appear here",
+      "ResultsForQuery": "Results for {query} should appear here",
+      "TypeToSearch": "Start typing to search for {what}",
+      "TypeToSearchTracks": "Start typing to search for tracks"
+    },
+    "Stats": {
+      "Description": "Your listening stats for the past week",
+      "Title": "Stats"
+    }
+  }
+}
diff --git a/src/locales/it_IT.json b/src/locales/it_IT.json
new file mode 100644
index 00000000..2992d876
--- /dev/null
+++ b/src/locales/it_IT.json
@@ -0,0 +1,866 @@
+{
+  "Accounts": {
+    "Admin": "Admin",
+    "AdminDesc": "Può far tutto",
+    "AllUsers": "Tutti gli utenti",
+    "EnableGuestAccess": "Abilita accesso ospite",
+    "EnableGuestAccessDesc": "Permetti utenti di accedere a questo sito senza un account",
+    "NewUser": "Nuovo utente",
+    "NoSelfDelete": "Non puoi cancellare te stesso!",
+    "ShowUsersOnLogin": "Mostra utenti durante l'accesso",
+    "ShowUsersOnLoginDesc": "Mostra un elenco di utenti disponibili durante l'accesso"
+  },
+  "AlbumView": {
+    "AlbumBy": "Album by ",
+    "DiskNumber": "Disco {num}",
+    "GenreBanner": {
+      "GenreDoesNotExist": "Nessun genere",
+      "GenreExists": "Generi"
+    },
+    "PlayDisc": "Riproduci disco",
+    "TrackCount": "Traccia | Tracce"
+  },
+  "ArtistCard": {
+    "TrackCount": "{count} Traccia | {count} Tracce"
+  },
+  "ArtistView": {
+    "LoadMore": "Carica altri",
+    "NoTracks": "Nessuna traccia",
+    "RepeatOptions": {
+      "All": "Ripeti tutte",
+      "None": "Nessuna ripetizione",
+      "One": "Ripeti singola"
+    },
+    "Title": "Artista"
+  },
+  "AuthLogin": {
+    "Back": "Indietro",
+    "BackToSelection": "Torna alla selezione",
+    "ContinueAsGuest": "O continua come ospite",
+    "EnterPassword": "Inserisci password",
+    "EnterUsername": "Inserisci nome utente",
+    "WelcomeBack": "Bentornato"
+  },
+  "BottomBar": {
+    "Favorite": "Preferita",
+    "GoToNowPlaying": "Vai a in riproduzione",
+    "PlaceholderArtist": "Benvenuto a Swing Music",
+    "PlaceholderTitle": "Benvenuto",
+    "RepeatOptions": {
+      "All": "Ripeti tutte",
+      "None": "Nessuna ripetizione",
+      "One": "Ripeti singola"
+    },
+    "Shuffle": "Mescola"
+  },
+  "Bubbles": {
+    "DropHere": "RILASCIA TRACCE QUA"
+  },
+  "CardList": {
+    "SortBy": "Ordina per",
+    "SortByOptions": {
+      "AlbumArtists": "Artista",
+      "CreatedDate": "Aggiunto in data",
+      "Date": "Anno di rilascio",
+      "Duration": "Durata",
+      "LastPlayed": "Ultima riproduzione",
+      "Name": "Nome",
+      "NoOfAlbums": "No. di album",
+      "PlayCount": "Numero di rip.",
+      "PlayDuration": "Durata riproduzione",
+      "Title": "Titolo",
+      "TrackCount": "N. di tracce"
+    }
+  },
+  "ChartItem": {
+    "ArtistPlays": "{count} ascolti totali"
+  },
+  "ChartItemGroup": {
+    "FetchingData": "recupero dati...",
+    "NoDataFound": "Nessun dato trovato per il periodo specificato: {per}"
+  },
+  "Charts": {
+    "ChartsDescription": "Gli artisti, album e canzoni più ascoltate",
+    "ChartsTitle": "Classifiche"
+  },
+  "Common": {
+    "Activate": "Attiva",
+    "Album": "Album | Albums",
+    "AlbumArtist": "Artista Album",
+    "All": "Tutte",
+    "AppTitle": "Swing Music",
+    "Appearance": "Aspetto",
+    "Appearances": "Comparse",
+    "Artist": "Artista | Artisti",
+    "Ascending": "Crescente",
+    "Autodetect": "autorileva",
+    "Backup": "Backup",
+    "Bitrate": "Bitrate",
+    "BuiltBy": "creato da @cwilvx ↗",
+    "Change": "Cambia",
+    "Compilations": "Raccolta | Raccolte",
+    "Configure": "Configura",
+    "ConfirmPass": "Conferma password",
+    "Connect": "Collega",
+    "Continue": "Continua",
+    "Create": "Crea",
+    "CreateAccount": "Crea account",
+    "DateAdded": "Data di aggiunta",
+    "Default": "Default",
+    "Delete": "Elimina",
+    "Descending": "Decrescente",
+    "Details": "Dettagli",
+    "Disc": "Disco",
+    "Discography": "Discografia {artist}",
+    "Disconnect": "Scollega",
+    "Duration": "Durata",
+    "FileName": "Nome File",
+    "Finish": "Termina",
+    "Folders": "Cartelle",
+    "HiSpace": "Ciao ",
+    "Image": "Immagine",
+    "LastPlayed": "Ultima riproduzione",
+    "Library": "Libreria",
+    "LogIn": "Accedi",
+    "LogOut": "Scollegati",
+    "Lyrics": "Testi canzoni",
+    "Modify": "Modifica",
+    "New": "Nuovo",
+    "NoResults": "Nessun risultato",
+    "NoSearchResults": "Non riesco a trovare nessun risultato per la tua ricerca.",
+    "NoTrackResults": "Nessun risultato trovato nelle tracce",
+    "NoTracks": "Nessuna traccia",
+    "NotificationError": "È avvenuto un errore!",
+    "NotificationErrorWithArg": "Fallito: {error}",
+    "NotificationFunnyError": "È successo qualcosa di divertentemente inaspettato!",
+    "NowPlaying": "In riproduzione",
+    "Other": "Altre",
+    "Password": "Password",
+    "Periods": {
+      "AllTime": "Sempre",
+      "Month": "Mese | Mesi",
+      "MonthShort": "me",
+      "OnceShort": "una volta",
+      "Week": "Settimana | Settimane",
+      "Year": "Anno | Anni",
+      "YearShort": "an"
+    },
+    "Pinned": "Fissato",
+    "Play": "Riproduci",
+    "PlayCount": "Numero di riproduzioni",
+    "PlayDuration": "Durata di riproduzione",
+    "Playlist": "Playlist",
+    "Playlists": "Playlists",
+    "Plugins": "Plugins",
+    "Recents": "Recenti",
+    "ReleaseDate": "Data di rilascio",
+    "Rescan": "Riscansiona",
+    "Saving": "Salvataggio",
+    "Search": "Trova",
+    "SearchResults": "Risultati della ricerca",
+    "SeeAll": "Vis. Tutti",
+    "Settings": "Impostazioni",
+    "SimilarArtists": "Artisti simili",
+    "Singles": "EP & Singles",
+    "SwingMusic": "Swing Music",
+    "Title": "Titolo",
+    "TopResult": "Risultati migliori",
+    "Track": "Traccia | Tracce",
+    "TrackCount": "{count} traccia | {count} tracce",
+    "Unknown": "Sconosciuto",
+    "Update": "Aggiorna",
+    "Username": "Nome utente",
+    "added": "aggiunto",
+    "album": "album | albums",
+    "artist": "artista | artisti",
+    "experimental": "sperimentale",
+    "mix": "mix | mixes",
+    "new": "nuovo",
+    "removed": "rimosso",
+    "selected": "selezionato",
+    "top": "migliori",
+    "track": "traccia | tracce",
+    "update": "aggiornare",
+    "upload": "caricare"
+  },
+  "ConfirmModal": {
+    "Cancel": "Annulla",
+    "Delete": "Elimina"
+  },
+  "Content": {
+    "SettingsDesc": "Personalizza le impostazioni e le tue preferenze"
+  },
+  "CrudPage": {
+    "CollectionName": "Nome collezione",
+    "CollectionTitle": " Collezione",
+    "Create": "Crea",
+    "CreateNotification": "Nuova collezione creata",
+    "DeleteButton": "Si, eliminala",
+    "DeleteDescription": "Sei sicuro di voler cancellare questa collezione?",
+    "DeleteNotification": "Collezione eliminata",
+    "DeleteTitle": "Elimina",
+    "Description": "Descrizione",
+    "NewTitle": "Nuova",
+    "Update": "Aggiorna",
+    "UpdateNotification": "Collezione aggiornata",
+    "UpdateTitle": "Aggiorna"
+  },
+  "DropDown": {
+    "SortByUppercase": "ORDINA PER {title} {order}"
+  },
+  "Favorites": {
+    "Album": "Album"
+  },
+  "FavoritesCard": {
+    "FavoriteTracks": "Tracce preferite",
+    "PlaylistUpper": "PLAYLIST"
+  },
+  "FolderView": {
+    "FileCount": "File | Files"
+  },
+  "HomeView": {
+    "Browse": {
+      "BrowseList": {
+        "Albums": "Album",
+        "Artists": "Artisti",
+        "FavAlbums": "Album pref.",
+        "FavArtists": "Artisti pref.",
+        "FavTracks": "Tracce pref.",
+        "Favorites": "Preferiti",
+        "Folders": "Cartelle",
+        "Playlists": "Playlist",
+        "Stats": "Statist."
+      },
+      "Title": "Sfoglia libreria"
+    },
+    "Greetings": {
+      "afternoon": "Buon pomeriggio, {name}",
+      "dawn": "Hey there uccello mattutino",
+      "evening": "Buona serata, {name}",
+      "midnight": "Hey animale notturno",
+      "morning": "Buongiorno, {name}"
+    },
+    "Title": "Home",
+    "title": "Home"
+  },
+  "Languages": {
+    "ChooseLang": "Scegli la tua lingua preferita",
+    "WarnAppReload": "(impostare la lingua forza un refresh dell'app)",
+    "en_US": "🇺🇸 Inglese (Stati Uniti)",
+    "it_IT": "🇮🇹 Italiano (Italia)",
+    "ko": "Coreano"
+  },
+  "LeftSidebar": {
+    "FileTypeBitrate": "tipo file • bitrate",
+    "NavItems": {
+      "Favorites": "Preferiti",
+      "Folder": "Cartelle",
+      "Home": "Home",
+      "Playlists": "Playlist",
+      "Search": "Cerca",
+      "Settings": "Impostazioni"
+    }
+  },
+  "MasterFlag": {
+    "MasterAudioBitrate": "Bitrate audio sorgente -"
+  },
+  "Menus": {
+    "Artist": {
+      "PlayNext": "Riproduci dopo la corrente"
+    },
+    "Common": {
+      "AddToCollection": "Aggiungi a collezione",
+      "AddToPlaylist": "Aggiungi a playlist",
+      "AddToQueue": "Aggiungi in coda",
+      "PlayNext": "Riproduci dopo la corrente",
+      "RemoveFromCollection": "Rimuovi oggetto",
+      "RemoveFromPlaylist": "Rimuovi dalla playlist",
+      "RemoveFromQueue": "Rimuovi dalla coda"
+    },
+    "PlayList": {
+      "RemoveFromPlaylist": "Rimuovi dalla playlist"
+    },
+    "Queue": {
+      "AddQueueToPlaylist": "Aggiungi la coda alla playlist",
+      "ArtistName": "Questo è {hash}",
+      "ClearQueue": "Svuota coda",
+      "FavoritesName": "Preferiti",
+      "PlaylistName": "{name} 2.0",
+      "SearchName": "Risultati di ricerca per {query}"
+    },
+    "Track": {
+      "DeleteTrack": "Cancella traccia",
+      "GoToAlbum": "Vai all'album",
+      "GoToArtist": "Vai all'artista",
+      "GoToFolder": "Vai alla cartella",
+      "OpenInFiles": "Apri in file"
+    },
+    "Utils": {
+      "NewCollection": "Nuova collezione",
+      "NewPlaylist": "Nuova playlist",
+      "SearchOn": "Cerca su"
+    }
+  },
+  "Mixes": {
+    "Radio": "Radio",
+    "SaveMix": "Salva mix",
+    "SavedMix": "Mix salvato",
+    "track": "traccia | tracce"
+  },
+  "Modal": {
+    "DeletePlaylist": "Sei sicuro di voler cancellare questa playlist in modo definitivo?",
+    "UpdatePlaylist": "Aggiorna playlist"
+  },
+  "Nav": {
+    "ResetClient": "Resetta client"
+  },
+  "NavTitles": {
+    "ArtistTracks": "Tracce Artisti",
+    "NowPlaying": "In riproduzione",
+    "Settings": "Impostazioni"
+  },
+  "NewPlaylist": {
+    "CreateButton": "Crea",
+    "NameNotEmpty": "Il nome della playlist non può essere vuoto",
+    "NamePlaceholder": "Inserisci un nome...",
+    "PlaylistName": "Nome playlist",
+    "Title": "Nuova playlist"
+  },
+  "NowPlaying": {
+    "GoToAlbum": "Vai ad album",
+    "GoToPlaySource": "Vai alla posizione della traccia",
+    "Queue": "Coda",
+    "UpNext": "Pros. traccia"
+  },
+  "Onboarding": {
+    "CreateAccountDesc": "Questo account sarà usato per amministrare il server.",
+    "CreateAccountTitle": "Crea account",
+    "ErrorPassDoNotMatch": "Le password non corrispondono",
+    "ErrorPassTooShort": "La password deve essere lunga almeno 8 caratteri",
+    "FilePicker": {
+      "Help": "Usa (⌘/Ctrl o Shift) + click per selezionare cartelle multiple",
+      "Selected": "{sel} selezionate",
+      "ThisFolderHelp": ". (questa cartella)"
+    },
+    "Finish": {
+      "ConfirmButton": "Clicca il pulsante sotto per proseguire nella tua libreria.",
+      "Processing": "Swing Music sta scansionando le tue cartelle selezionate. Attendi ...",
+      "TitleAlmostDone": "Ci sei quasi!",
+      "TitleDone": "Hai finito! 🎉"
+    },
+    "RootDirs": {
+      "AddFolders": "Aggiungi cartelle",
+      "ErrorSelectRootFolder": "Seleziona una cartella radice",
+      "FolderSelected": "{n} cartella selezionata | {n} cartelle selezionate",
+      "FolderSelectedDesc": "Seleziona cartella per effettuarne la scansione",
+      "HomeDir": "Cartella home",
+      "HomeDirDesc": "Scansiona tutte le cartelle in ",
+      "SpecificFolder": "Cartella specifica",
+      "Title": "Configura cartelle musicali",
+      "TitleDesc": "Dove vuoi che Swing Music cerchi le tue tracce musicali?"
+    },
+    "Welcome": {
+      "GetStarted": "Iniziamo",
+      "Tagline": "Clicca il pulsante sotto per creare il tuo primo account",
+      "Title": "Benvenuto a"
+    }
+  },
+  "Pairing": {
+    "ErrorPairingCode": "Errore nel recupero del codice di pairing. Codice di errore: {res}",
+    "ScanQRCode": "Scansiona il QRCode con l'app Swing Music per accedere automaticamente a questo server."
+  },
+  "PlaylistView": {
+    "AllTracks": "Tutte le tracce",
+    "Edit": "Modifica",
+    "LastUpdated": "Aggiornato in {date}"
+  },
+  "Profile": {
+    "AddUser": "Aggiungi utente",
+    "ConfirmPassword": "Conferma password",
+    "HiUser": "Ciao {user}",
+    "LangNotCurrentlySupported": "Lingua non supportata attualmente",
+    "PasswordAction": "{action} password",
+    "PasswordMismatch": "Le password sono diverse",
+    "SelectLanguage": "Inserisci la lingua desiderata",
+    "SetLanguage": "Imposta lingua",
+    "Username": "Nome utente"
+  },
+  "ProfileDropdown": {
+    "HiUser": "Ciao {user}",
+    "QuickScan": "Scan. veloce"
+  },
+  "Requests": {
+    "Album": {
+      "AlbumNotCreatedYet": "Album non ancora creato!"
+    },
+    "Artists": {
+      "ArtistNotFound": "Artista non trovato"
+    },
+    "Collections": {
+      "AddOrRemCollSuccess": "{payload} {command} dalla pagina",
+      "CollectionAlreadyPresent": "{payload} è già presente nella collezione"
+    },
+    "Playlists": {
+      "AddedToPlaylist": "Aggiunto a {name}",
+      "AlreadyExists": "Questa playlist esiste già",
+      "BannerImageRemoved": "Immagine del banner rimossa",
+      "BannerImageRemovedError": "Non riesco a rimuovere l'immagine del banner",
+      "CreatedSuccesfully": "Playlist creata correttamente!",
+      "Deleted": "Playlist cancellata",
+      "ErrUnsupportedImage": "Fallito: immagine non supportata",
+      "NotFound": "Playlist non trovata",
+      "TrackAlreadyPresent": "La traccia è gia presente nella playlist",
+      "TrackRemoved": "Traccie rimosse",
+      "TrackRemovedError": "Non riesco a rimuovere le tracce",
+      "Updated": "Playlist aggiornata!"
+    },
+    "RootDirs": {
+      "ErrorAdding": "Errore aggiungendo le cartelle radici",
+      "ErrorRemoving": "Errore rimuovendo le cartelle radici",
+      "ScanError": "Errore durante l'avviamento della scansione",
+      "ScanStarted": "Nuova scansione avviata",
+      "Success": "Cartelle radici configurate"
+    }
+  },
+  "RightSidebar": {
+    "BackToQueue": "ritorna alla coda",
+    "NoQueueDescription": "Quando inizierai a riprodurre canzoni, queste appariranno qua.",
+    "NoQueueTitle": "Nessuna canzone in coda",
+    "NowPlaying": "Riproducendo",
+    "Shuffle": "Shuffle",
+    "SimilarTracks": "Tracce simili"
+  },
+  "RootDirsPrompt": {
+    "HomeDir": "Cartella home",
+    "HomeDirInfo": "Scansiona tutte le cartelle nella tua home.",
+    "SpecificDir": "Cartella specifica",
+    "SpecificDirInfo": "Seleziona le cartelle contententi la musica da scansionare.",
+    "WhereToLook": "Dove vuoi cercare la tua musica?"
+  },
+  "Search": {
+    "BackToQueue": "Ritorna alla coda",
+    "GoToSearch": "Vai alla ricerca",
+    "NoResultsDescription": "Non riesco a trovare nessuna traccia con i parametri specificati.",
+    "NoResultsTitle": "Nessun risultato",
+    "NoTracksTitle": "nessuna traccia",
+    "SearchPlaceholder": "Scrivi per cercare",
+    "TopResult": "Miglior risultato",
+    "top": "Top"
+  },
+  "SearchInput": {
+    "BackToQueue": "torna alla coda",
+    "GoToSearch": "vai alla ricerca"
+  },
+  "SetRootDirs": {
+    "AddAllChecked": "Aggiungi tutte le cartelle spuntate",
+    "NoSubFolders": "Nessuna cartella qua. Clicca \"aggiungi questa cartella\" per aggiungere la posizione attuale.",
+    "SelectThisFolder": "Aggiungi questa cartella"
+  },
+  "Settings": {
+    "About": {
+      "Developer": "Swing Music è un atto d'amore sviluppato su GitHub all'indirizzo {link}. Se questo software ti piace, una stellina sul progetto sarebbe molto apprezzata. Spero tu l'apprezzi tanto quanto mi son divertito a scriverla da zero. 😁🤗",
+      "GetInTouchDescription": "Se apprezzi il mio lavoro, e ti piacerebbe salutarmi, mi farebbe piacere un contatto (in inglese).",
+      "GetInTouchTitle": "Rimani in contatto",
+      "LicenseDesc": "Gestisci la tua chiave di licenza, la tua sottoscrizione e i tuoi dispositivi autorizzati.",
+      "LicenseDisplayName": "Licenza e sottoscrizione",
+      "LicenseTitle": "Licenza",
+      "LinksContribute": "Contribuisci",
+      "LinksDocs": "Docs",
+      "LinksGitHub": "Stellina su GitHub",
+      "LinksIssue": "Segnala un problema (in inglese)",
+      "LinksTitle": "Links",
+      "SendEmail": "Manda Email",
+      "Title": "Riguardo a"
+    },
+    "Accounts": {
+      "Desc": "Accedi alla app mobile usando un QR code",
+      "Title": "Accounts"
+    },
+    "AppWidth": {
+      "Extend": "Larghezza piena",
+      "ExtendDesc": "Permetti all'applicazione di estendersi per tutta la larghezza dello schermo"
+    },
+    "Audio": {
+      "CrossfadeDuration": {
+        "Description": "Durata in secondi del crossfade",
+        "Title": "Durata crossfade"
+      },
+      "LegacyStreaming": {
+        "Description": "Abilita se riscontro problemi durante lo streaming",
+        "Title": "Usa streaming legacy"
+      },
+      "Playback": "Riproduzione",
+      "PlaybackDesc": "Impostazioni riguado la riproduzione audio",
+      "StreamingQuality": {
+        "1024Flac": "Alta (1024kbps) (FLAC)",
+        "128": "128kbps",
+        "320": "320kbps",
+        "640Flac": "Media (640kbps) (FLAC)",
+        "96": "96kbps",
+        "Description": "Scegli la qualità audio durante lo streaming",
+        "Original": "Originale",
+        "Title": "Qualità streaming"
+      },
+      "Title": "Audio",
+      "UseCrossfade": {
+        "Description": "Riduci il volume dell'audio della traccia corrente in uscita mentre aumenti l'audio della canzone in ingresso",
+        "Title": "Abilita crossfade"
+      },
+      "UseSilence": {
+        "Description": "Salta automaticante il silenzio audio tra le tracce",
+        "Title": "Rimozione del silenzio tra le tracce"
+      }
+    },
+    "Backup": {
+      "BackupCount": "Hai {count} backup(s) nella tua cartella dei backup.",
+      "BackupSuccess": "Backup creato",
+      "CollectionCount": "{count} collezione | {count} collezioni",
+      "FavoriteCount": "{count} preferito | {count} preferiti",
+      "PlaylistCount": "{count} playlist | {count} playlists",
+      "RestoreAllButton": "Ripristina tutto",
+      "RestoreBackup": "Ripristina Backup",
+      "RestoreButton": "Ripristina",
+      "ScrobbleCount": "{count} scrobble | {count} scrobbles",
+      "ThankYouMessage": "Ti ringrazio per aver sponsorizzato Swing Music!",
+      "Title": "Backup"
+    },
+    "Cancel": "Annulla",
+    "ContextChildren": {
+      "ShowMode": "Mostra i menu del tasto destro su"
+    },
+    "Experimental": "sperimentale",
+    "General": {
+      "AlbumInfoSettingsDesc": "Impostazioni riguardo i dettagli degli albums",
+      "Albums": {
+        "AlbumAsSingles": {
+          "Description": "Richiedi che un album abbia almeno due tracce",
+          "Title": "Marca album con una sola traccia come singles"
+        },
+        "CleanTitles": {
+          "Description": "Rimuovi testo in parentesi dai titoli ed elaboralo separatamente, se possibile",
+          "Title": "Pulisci titoli album"
+        },
+        "MergeAlbum": {
+          "Description": "Tutte le versioni diverse dello stesso album verranno unite in un singolo album",
+          "Title": "Unisci versioni albums"
+        }
+      },
+      "ArtistSeparatorDesc": "Personalizza i separatori degli artisti",
+      "Artists": {
+        "ArticleAwareDesc": "Ignora articoli (p.e. The, A, An) nell'ordinamento del nome degli artisti",
+        "ArticleAwareTitle": "Ordinamento intelligente articoli",
+        "SeparatorDesc": "Saranno usati per separare artisti e artisti degli album",
+        "SeparatorTitle": "Inserisci i separatori separati da virgole"
+      },
+      "ArtistsDesc": "Personalizza le impostazioni degli artisti",
+      "BackupMainDesc": "Esegui e ripristina il backup delle tue librerie",
+      "Backups": {
+        "AutomaticBackups": {
+          "Description": "Crea un backup automatico ogni 6 ore",
+          "Title": "Backup automatici"
+        },
+        "BackupNow": {
+          "Description": "Directory di backup: ~/swingmusic.backups",
+          "Title": "Esegui backup"
+        }
+      },
+      "CircularArtist": {
+        "Description": "Disabilita il layout a gradiente standard e usa invece una semplice immagine circolare",
+        "Title": "Intestazione della pagina dell'artista semplificata"
+      },
+      "FolderListMode": {
+        "Title": "Mostra cartelle in modalità lista"
+      },
+      "MainSettingsDescription": "Impostazioni riguardo varie parti dell'interfaccia utente.",
+      "NowPlaying": {
+        "DisableNPTitle": "Nascondi l'immagine dell'album dalla barra a sinistra",
+        "FavoriteInline": {
+          "Description": "Mostra il pulsante dei preferiti accanto alla durata della traccia",
+          "Title": "Mostra l'icona dei preferiti inline"
+        },
+        "HighlightFavorite": {
+          "Description": "Mostra sempre il pulsante dei preferiti sulle tracce preferite",
+          "Title": "Evidenzia tracce preferite"
+        },
+        "OnTabTitle": {
+          "Description": "Sostituisci le informazioni della pagina corrente con la canzone in riproduzione",
+          "Title": "Mostra la canzone in riproduzione attuale nel titolo della pagina"
+        }
+      },
+      "RootDirs": {
+        "EnablePeriodicScans": "Abilita scansioni periodiche",
+        "PeriodicScanInterval": "Intervallo della scansione periodica (in minuti)",
+        "ShowPlaylistInFolders": {
+          "Description": "Naviga playlists e preferiti nella visualizzazione a cartella (pensata per l'app mobile)",
+          "Title": "Mostra le playlists nella visualizzazione a cartella"
+        },
+        "UseWatchdog": "Controlla le cartelle radici per trovare nuova musica"
+      },
+      "Separators": {
+        "Description": "Questi saranno usati per separare gli artisti e artisti degli album",
+        "Title": "Inserisci i separatori separati da una virgola"
+      },
+      "Sidebar": {
+        "Description": "CTRL + B",
+        "Title": "Mostra/nascondi barra destra"
+      },
+      "TrackInfoSettingsDesc": "Impostazioni riguado i dettagli delle tracce",
+      "Tracks": {
+        "HideRemaster": {
+          "Description": "Rimuovi riferimenti riguardo eventuali remaster dai titoli delle canzoni ",
+          "Title": "Nascondi informazioni remaster"
+        },
+        "ProcessFeatArtists": {
+          "Description": "Rimuovi gli artisti in evidenza dai titoli e uniscili con gli altri artisti",
+          "Title": "Artisti in evidenza"
+        },
+        "RemoveProd": {
+          "Description": "Rimuovi 'prod.' dal titolo delle tracce",
+          "Title": "Nascondi 'prod.'"
+        }
+      },
+      "UseNoSidebarTitle": "Usa il layout senza barre laterali"
+    },
+    "License": {
+      "ActivateLicense": "{action} licenza",
+      "Amount": "Quantità",
+      "AuthDevices": "Dispositivi autorizzati",
+      "AutoRenewOff": "Addebito auto off",
+      "CanceledAt": "Terminata ",
+      "CurrentlyUsed": "Istanze che utilizzano la tua chiave di licenza ({cur}/{tot} attivi)",
+      "Expires": "Scade",
+      "GithubSponsorTitle": "Benefit GitHub Sponsor",
+      "GithubSponsors": "Sponsors GitHub",
+      "LastActivity": "Ultima attività: {time}",
+      "LicenseKey": {
+        "AlreadyHave": "Hai già una chiave di licenza?",
+        "Info": "Informazioni chiave licenza",
+        "Paste": "Incolla la chiave di licenza qui:",
+        "Update": "Aggiorna la chiave di licenza:"
+      },
+      "LogInToGithub": "Accedi a GitHub",
+      "Manage": "Gestisci {lic} ↗",
+      "NewOrUpServerName": "{action} server:",
+      "NoActiveSub": "Nessun abbonamento attivo",
+      "NoActiveSubDesc": "Ottieni un abbonamento per sbloccare tutte le funzionalità premium.\n Usa il link qui sotto per sfogliare piani e vantaggi disponibili.",
+      "NoActivity": "Nessuna attività",
+      "NoGithubLogin": "Il premium di Swing Music è disponibile per tutti i donatori su Github Sponsor. Accedici per averne l'accesso.",
+      "RefreshStatus": "Aggiorna stato",
+      "Renewal": "Rinnova",
+      "Revoke": "Revoca",
+      "SaveChanges": "Salva modifiche",
+      "SponsorOnGithub": "Sponsorizza su GitHub ❤️",
+      "Sponsorship": "Sponsor",
+      "Status": "Stato",
+      "Subscription": "Abbonamento",
+      "ThanksCustName": "Ciao @{cust}! Hai accesso a Swing Music Premium.",
+      "ThanksWithHearts": "Grazie per il tuo supporto. ❤️❤️",
+      "Tier": "Livello",
+      "ViewPricing": "Mostra prezzi"
+    },
+    "List": {
+      "RootNotConfigured": "Cartella radice non impostata. Usa il pulsante \"Configure\" per impostarla"
+    },
+    "MasterFlag": {
+      "Show": "Flag master"
+    },
+    "NowPlaying": {
+      "AlbumArt": "Mostra l'immagine di copertina nella barra di sinistra",
+      "Description": "Impostazioni riguardo la canzone in riproduzione",
+      "Title": "In riproduzione"
+    },
+    "NumberInput": {
+      "InvalidNumber": "Numero non valido",
+      "UpdateFailed": "Aggiornamento fallito",
+      "Updated": "Aggiornato"
+    },
+    "Pairing": {
+      "Title": "Collega dispositivo"
+    },
+    "Plugins": {
+      "LastFM": {
+        "ApiKey": {
+          "Description": "invece di quella usata di default da Swing Music per autenticarsi a Last.fm",
+          "Title": "Usa key API personalizzata"
+        },
+        "ApiSecret": {
+          "Description": "invece di quella usata di default da Swing Music per firmare i tuoi invii scrobble",
+          "Title": "Usa segreto API personalizzato"
+        },
+        "Authorize": {
+          "Description": "Connetti il tuo account Last.fm a Swing Music ",
+          "Title": "Collega il tuo account"
+        },
+        "Description": "Condividi la tua musica su Last.fm",
+        "Title": "Last.fm"
+      },
+      "Lyrics": {
+        "AutoDownload": {
+          "Description": "Scarica automaticamente i testi mancanti quando apri la  pagina dei testi delle canzoni",
+          "Title": "Scarica automaticamente testi"
+        },
+        "OverrideLocal": {
+          "Description": "Scarica comunque i testi anche sono già presenti testi locali non sincronizzati alla musica",
+          "Title": "Ignora testi locali non sincronizzati"
+        },
+        "ToggleLyrics": {
+          "Title": "Abilita plugin"
+        },
+        "TrustCloud": {
+          "Desc": "Non mostrare testi non verificati (licenza premium richiesta)",
+          "Title": "Mostra solo testi verificati"
+        }
+      },
+      "LyricsDescription": "Cerca e visualizza testi delle canzoni trovate su internet."
+    },
+    "Profile": {
+      "Desc": "Gestisci il tuo profilo e le informazioni di login",
+      "Title": "Profilo"
+    },
+    "RootDirs": {
+      "Change": "Cambia le tue cartelle radici",
+      "Current": "Cartelle radici attuali",
+      "Description": "Impostazioni riguardo le tue cartelle radici",
+      "Title": "Cartelle radici"
+    },
+    "Save": "Salva",
+    "ShowFolders": {
+      "As": "Mostra cartelle come"
+    },
+    "Sidebar": {
+      "UseSidebar": "Mostra la barra di destra"
+    }
+  },
+  "Stores": {
+    "Auth": {
+      "GuestUserAdded": "Utente ospite aggiunto con successo!",
+      "ProfileUpdated": "Profilo aggiornato con successo!",
+      "UserAddedSucc": "Utente aggiunto con successo!",
+      "UserDeleted": "Utente {user} cancellato con successo!"
+    },
+    "Player": {
+      "AutoplayBlockedError": "Tocca ovunque la pagina per riprovare (autoplay bloccato)",
+      "LoadErrorWithArg": "Non riesco a caricare: {queue}",
+      "PlayerErrorWithArg": "Errore player: {msg}"
+    },
+    "Queue": {
+      "AddedTrack": "Aggiunta una traccia alla coda"
+    },
+    "Tracklist": {
+      "AddTrackToQueue": "Aggiunta {n} traccia alla coda | Aggiunte {n} tracce alla coda"
+    }
+  },
+  "TrackItem": {
+    "AddToFavorites": "Aggiungi ai preferiti",
+    "RemoveFromFavorites": "Rimuovi dai preferiti",
+    "RemoveFromQueue": "Rimuovi dalla coda"
+  },
+  "UpNext": {
+    "NextUp": "La prossima",
+    "PlayNextSong": "riproduci prossima traccia"
+  },
+  "UpdatePlaylist": {
+    "CoverAction": "Clicca per {action} l'immagine di copertina",
+    "ImagePosition": "Modifica posizione immagine • {pos} %",
+    "Name": "Nome playlist",
+    "SquareCover": "Rendi la copertina squadrata"
+  },
+  "UsePlayFrom": {
+    "AlbumTracksNotFound": "Tracce album non trovate",
+    "ArtistTracksNotFound": "Tracce artista non trovate",
+    "FolderTracksNotFound": "Tracce della cartella non trovate"
+  },
+  "Utils": {
+    "FormatTime": {
+      "Hour": "{hrs} ora | {hrs} ore",
+      "Minute": "{mnt} minuto | {mnt} minuti",
+      "Second": "{sec} secondo | {sec} secondi"
+    },
+    "PlayingFrom": {
+      "FavoriteTracks": "Tracce preferite",
+      "NoSource": "👻 Nessuna sorgente",
+      "SearchFrom": "Cerca per: \"{source}\""
+    }
+  },
+  "Views": {
+    "AlbumViews": {
+      "MoreFrom": "Altro da {art}",
+      "OtherVersions": "Altre edizioni",
+      "RelatedAlbums": "Albums correlati"
+    },
+    "ArtistDiscography": {
+      "AllAlbums": "Tutti gli albums",
+      "Contributions": "Contribuzioni",
+      "NoContributions": "Nessun contributo",
+      "NoContributionsDesc": "Nessun {type} trovato per {artist}"
+    },
+    "FavCardScroller": {
+      "Desc": "Hai {nelem} {type} preferito | Hai {nelem} {type} preferiti",
+      "Title": "{item} preferiti"
+    },
+    "FavoriteTracks": {
+      "Description": "Hai {n_tr} canzone preferita | Hai {n_tr} canzoni preferite",
+      "Title": "Tracce preferite"
+    },
+    "Favorites": {
+      "CountStats": "{tra} Tracce • {alb} Albums • {art} Artisti",
+      "Description": "Puoi aggiungere tracce, albums e artisti ai tuoi preferiti cliccando sull'icona a forma di cuoricino",
+      "NoFavoritesFound": "Nessun preferito trovato",
+      "Title": "Preferiti"
+    },
+    "FolderView": {
+      "FolderIsEmpty": "Cartella vuota",
+      "NoIndexedTracks": "La cartella che hai aperto non ha nessuna traccia indicizzata. Aggiungi canzoni a questa cartella e riprova",
+      "NoResultFound": "Nessun risultato trovato",
+      "NoTracksForQuery": "Nessuna cartella o traccia in questa specifica cartella corrisponde alla query: {query}"
+    },
+    "Header": {
+      "TotalAlbumAndArtists": "Hai {tot} {what} nella tua libreria"
+    },
+    "LyricView": {
+      "NoLyricsFoundFirst": "Non hai il testo",
+      "NoLyricsFoundSecond": "di questa canzone",
+      "SearchOnline": "Cerca online",
+      "Searching": "Cercando...",
+      "Unsynced": "non sincronizzata"
+    },
+    "MixLisView": {
+    },
+    "MixListView": {
+      "MixesBasedOnListening": "{n} mixes • In base agli artisti che hai ascoltato ultimamente",
+      "OtherMixes": "Altri mixes di {type}",
+      "SavedMixes": "Mixes salvati",
+      "mixes": "mixes"
+    },
+    "MixView": {
+      "MixNotFound": "404: Mix non trovato"
+    },
+    "NotFound": {
+      "Error": "404! Pagina non trovata!"
+    },
+    "PlaylistList": {
+      "AllPlaylists": "Tutte le playlists",
+      "Description": "Hai {n} playlists nella tua libreria",
+      "NoItemDescription": "Puoi creare una playlist facendo click con il tasto destro su una traccia e selezionando l'opzione \"aggiungi a playlist\"",
+      "NoPlaylistsFound": "Nessuna playlist trovata",
+      "OtherPlaylists": "Altre playlists",
+      "SearchPlaylist": "Cerca playlists",
+      "Title": "Playlists"
+    },
+    "PlaylistView": {
+      "AddMoreDesc": "Aggiungine altre facendo click con il tasto destro del mouse e seleziona \"aggiungi a playlist\"",
+      "NoTracks": "Nessuna traccia in questa playlist"
+    },
+    "SearchView": {
+      "NoResults": "Nessun risultato per {page}",
+      "NoResultsDesc": "I risultati compaiono qua",
+      "ResultsForQuery": "I risultati per {query} verranno mostrati qua",
+      "TypeToSearch": "Inizia a scrivere per cercare per {what}",
+      "TypeToSearchTracks": "Inizia a scrivere per cercare nelle tracce"
+    },
+    "Stats": {
+      "Description": "Le tue statistiche d'ascolto nell'ultima settimana",
+      "Title": "Statistiche"
+    }
+  }
+}
diff --git a/src/locales/ko.json b/src/locales/ko.json
new file mode 100644
index 00000000..3b5fe384
--- /dev/null
+++ b/src/locales/ko.json
@@ -0,0 +1,143 @@
+{
+  "Common": {},
+  "AlbumView": {
+    "AlbumBy": "",
+    "TrackCount": "트랙",
+    "GenreBanner": {
+      "GenreExists": "장르",
+      "GenreDoesNotExist": "장르 없음"
+    }
+  },
+  "ArtistView": {
+    "Title": "아티스트",
+    "NoTracks": "트랙 없음",
+    "RepeatOptions": {
+      "All": "전체 반복",
+      "One": "한 곡 반복",
+      "None": "반복 안 함"
+    }
+  },
+  "BottomBar": {
+    "GoToNowPlaying": "현재 재생으로 이동",
+    "PlaceholderTitle": "반가워요",
+    "PlaceholderArtist": "Swing Music에 오신 것을 환영합니다"
+  },
+  "Bubbles": {
+    "DropHere": "여기에 트랙을 내려놓으세요"
+  },
+  "CardList": {
+    "SortBy": "정렬 기준",
+    "SortByOptions": {
+      "TrackCount": "트랙 수",
+      "Duration": "재생 시간",
+      "CreatedDate": "추가된 날짜",
+      "LastPlayed": "마지막 재생",
+      "PlayCount": "재생 수",
+      "PlayDuration": "재생 시간",
+      "Title": "제목",
+      "AlbumArtists": "아티스트",
+      "Date": "발매 연도",
+      "Name": "이름",
+      "NoOfAlbums": "앨범 수"
+    }
+  },
+  "FolderView": {
+    "FileCount": "파일"
+  },
+  "HomeView": {
+    "Title": "홈",
+    "Greetings": {
+      "midnight": "저녁형 인간이시군요",
+      "dawn": "아침형 인간이시군요",
+      "morning": "{name}님, 좋은 아침이에요",
+      "afternoon": "{name}님, 좋은 오후에요",
+      "evening": "{name}님, 좋은 저녁이에요"
+    },
+    "Browse": {
+      "Title": "라이브러리 탐색",
+      "BrowseList": {
+        "Folders": "폴더",
+        "Albums": "앨범",
+        "Artists": "아티스트",
+        "Playlists": "재생 목록",
+        "Favorites": "즐겨찾기",
+        "FavTracks": "즐겨찾는 트랙",
+        "FavArtists": "즐겨찾는 아티스트",
+        "FavAlbums": "즐겨찾는 앨범",
+        "Stats": "통계"
+      }
+    }
+  },
+  "LeftSidebar": {
+    "NavItems": {
+      "Folder": "폴더",
+      "Favorites": "즐겨찾기",
+      "Playlists": "재생 목록",
+      "Home": "홈",
+      "Search": "검색",
+      "Settings": "설정"
+    }
+  },
+  "NowPlaying": {
+    "GoToAlbum": "앨범으로 이동",
+    "UpNext": "다음 곡",
+    "Queue": "대기열",
+    "GoToPlaySource": "재생 소스로 이동"
+  },
+  "PlaylistsList": {},
+  "PlaylistView": {
+    "LastUpdated": "{date}에 마지막으로 업데이트됨",
+    "Edit": "편집",
+    "AllTracks": "모든 트랙"
+  },
+  "RightSidebar": {
+    "SimilarTracks": "유사한 트랙",
+    "Shuffle": "셔플",
+    "NowPlaying": "현재 재생",
+    "NoQueueTitle": "대기열에 곡이 없습니다",
+    "NoQueueDescription": "곡 재생을 시작하면 여기에 나타납니다."
+  },
+  "Search": {
+    "NoResultsTitle": "결과 없음",
+    "NoTracksTitle": "트랙 없음",
+    "NoResultsDescription": "검색 결과를 찾을 수 없습니다.",
+    "TopResult": "최고 결과",
+    "BackToQueue": "대기열로 돌아가기",
+    "GoToSearch": "검색으로 이동",
+    "SearchPlaceholder": "검색어를 입력하세요"
+  },
+  "Settings": {
+    "Save": "저장",
+    "Cancel": "취소",
+    "Backup": {
+      "Title": "백업",
+      "RestoreBackup": "백업 복원",
+      "BackupCount": "백업 디렉토리에 {count} 개의 백업이 있습니다.",
+      "PlaylistCount": "{count} 개의 재생 목록",
+      "ScrobbleCount": "{count} 개의 스크로블",
+      "FavoriteCount": "{count} 개의 즐겨찾기",
+      "CollectionCount": "{count} 개의 컬렉션",
+      "RestoreButton": "복원",
+      "RestoreAllButton": "모두 복원"
+    },
+    "List": {
+      "RootNotConfigured": "루트 디렉토리가 구성되지 않았습니다. 위의 \"구성\" 버튼을 사용하여 구성하세요."
+    },
+    "NumberInput": {
+      "InvalidNumber": "유효하지 않은 숫자",
+      "Updated": "업데이트됨",
+      "UpdateFailed": "업데이트 실패"
+    },
+    "About": {
+      "Developer": "Swing Music은 GitHub의 {link}가 사랑을 담아 제작했습니다. 이 소프트웨어가 마음에 드신다면, GitHub에서 Star를 남겨 주세요. 저도 개발하는 것을 즐기는 만큼 여러분도 즐겨주시면 좋겠어요. 😁🤗",
+      "LinksTitle": "링크",
+      "LinksDocs": "문서",
+      "LinksGitHub": "GitHub에서 Star 남기기",
+      "LinksIssue": "문제 보고",
+      "LinksContribute": "기여하기",
+      "GetInTouchTitle": "연락하기",
+      "GetInTouchDescription": "제 작업이 마음에 드시고 인사하고 싶으시다면, 연락을 기다리겠습니다.",
+      "SendEmail": "이메일 보내기"
+    }
+  }
+}
diff --git a/src/main.ts b/src/main.ts
index 1e455135..44a16174 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -21,14 +21,17 @@ import vTooltip from "./directives/vTooltip";
 import "./assets/scss/index.scss";
 import "vue-virtual-scroller/dist/vue-virtual-scroller.css";
 
-const app = createApp(App);
+import i18n from "./i18n";
+
 const pinia = createPinia();
 pinia.use(piniaPluginPersistedstate);
+const app = createApp(App);
 
 app.use(pinia);
 app.use(router);
 app.use(autoAnimatePlugin);
-app.use(VWave);
+app.use(VWave, {});
+app.use(i18n);
 app.use(MotionPlugin);
 
 app.directive("tooltip", vTooltip);
@@ -38,4 +41,4 @@ app.component("RecycleScroller", RecycleScroller);
 app.component("DynamicScroller", DynamicScroller);
 app.component("DynamicScrollerItem", DynamicScrollerItem);
 
-app.mount("#app");
+app.mount("#app");
\ No newline at end of file
diff --git a/src/requests/album.ts b/src/requests/album.ts
index c54e335b..3dfd1d84 100644
--- a/src/requests/album.ts
+++ b/src/requests/album.ts
@@ -2,6 +2,9 @@ import { paths } from '@/config'
 import { Album, StatItem, Track } from '@/interfaces'
 import { NotifType, useToast } from '@/stores/notification'
 import useAxios from './useAxios'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 const {
     album: albumUrl,
@@ -36,7 +39,7 @@ const getAlbumData = async (albumhash: string, albumlimit: number) => {
     })
 
     if (status == 204) {
-        useToast().showNotification('Album not created yet!', NotifType.Error)
+        useToast().showNotification(t('Requests.Album.AlbumNotCreatedYet'), NotifType.Error)
     }
 
     return data as AlbumData
diff --git a/src/requests/artists.ts b/src/requests/artists.ts
index c5760ca0..98ef4271 100644
--- a/src/requests/artists.ts
+++ b/src/requests/artists.ts
@@ -2,6 +2,9 @@ import { paths } from '@/config'
 import { Album, Artist, Genre, StatItem, Track } from '@/interfaces'
 import { NotifType, useToast } from '@/stores/notification'
 import useAxios from './useAxios'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 export const getArtistData = async (hash: string, limit: number = 15, albumlimit: number = 7) => {
     interface ArtistData {
@@ -23,7 +26,7 @@ export const getArtistData = async (hash: string, limit: number = 15, albumlimit
     })
 
     if (status == 404) {
-        useToast().showNotification('Artist not found', NotifType.Error)
+        useToast().showNotification(t('Requests.Artists.ArtistNotFound'), NotifType.Error)
     }
 
     if (error) {
diff --git a/src/requests/collections.ts b/src/requests/collections.ts
index 9bc8f6c2..2803a7a7 100644
--- a/src/requests/collections.ts
+++ b/src/requests/collections.ts
@@ -2,6 +2,9 @@ import { paths } from '@/config'
 import { Album, Artist, Collection, Mix, Playlist } from '@/interfaces'
 import { Notification, NotifType } from '@/stores/notification'
 import useAxios from './useAxios'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 const { base: baseCollectionUrl } = paths.api.collections
 
@@ -107,20 +110,23 @@ export async function addOrRemoveItemFromCollection(
 
     if (status == 200) {
         new Notification(
-            `${payload.type[0].toUpperCase() + payload.type.slice(1)} ${
-                command == 'add' ? 'added' : 'removed'
-            } to page`,
+            t('Requests.Collections.AddOrRemCollSuccess', 
+                {   
+                    payload: payload.type[0].toUpperCase() + payload.type.slice(1), 
+                    command: command == 'add' ? t('Common.added') : t('Common.removed')
+                }
+            ),
             NotifType.Success
         )
         return true
     }
 
     if (status == 400) {
-        new Notification(`${payload.type[0].toUpperCase() + payload.type.slice(1)} already in collection`, NotifType.Error)
+        new Notification(t('Requests.Collections.CollectionAlreadyPresent', {payload: payload.type[0].toUpperCase() + payload.type.slice(1)}), NotifType.Error)
         return false
     }
 
-    new Notification('Failed: ' + data.error, NotifType.Error)
+    new Notification(t('Common.NotificationErrorWithArg', {error: data.error}), NotifType.Error)
     return false
 }
 
diff --git a/src/requests/favorite.ts b/src/requests/favorite.ts
index 5a6420ce..fd1c2e86 100644
--- a/src/requests/favorite.ts
+++ b/src/requests/favorite.ts
@@ -4,6 +4,9 @@ import useAxios from './useAxios'
 
 import { Album, Artist, Track } from '@/interfaces'
 import { useToast as notif } from '@/stores/notification'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 export async function addFavorite(favtype: favType, itemhash: string) {
     const { error } = await useAxios({
@@ -15,7 +18,7 @@ export async function addFavorite(favtype: favType, itemhash: string) {
     })
 
     if (error) {
-        notif().showNotification('An error occured!', NotifType.Error)
+        notif().showNotification(t('Common.NotificationError'), NotifType.Error)
         return false
     }
 
@@ -32,7 +35,7 @@ export async function removeFavorite(favtype: favType, itemhash: string) {
     })
 
     if (error) {
-        notif().showNotification('An error occured!', NotifType.Error)
+        notif().showNotification(t('Common.NotificationError'), NotifType.Error)
         return false
     }
 
diff --git a/src/requests/playlists.ts b/src/requests/playlists.ts
index a6abbc6e..fdb73a35 100644
--- a/src/requests/playlists.ts
+++ b/src/requests/playlists.ts
@@ -3,6 +3,9 @@ import { Artist, Playlist, Track } from '@/interfaces'
 import { NotifType, Notification, useToast } from '@/stores/notification'
 import useAxios from './useAxios'
 import useFolder from '@/stores/pages/folder'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 const { new: newPlaylistUrl, base: basePlaylistUrl, artists: playlistArtistsUrl } = paths.api.playlist
 
@@ -19,14 +22,14 @@ export async function createNewPlaylist(playlist_name: string) {
     })
 
     if (status == 201) {
-        new Notification('Playlist created successfullly!', NotifType.Success)
+        new Notification(t('Requests.Playlists.CreatedSuccesfully'), NotifType.Success)
         return data.playlist as Playlist
     }
 
-    let message = 'Something went wrong'
+    let message = t('Common.NotificationError')
 
     if (status == 409) {
-        message = 'That playlist already exists'
+        message = t('Requests.Playlists.AlreadyExists')
     }
 
     new Notification(message, NotifType.Error)
@@ -67,7 +70,7 @@ export async function getPlaylist(pid: number | string, no_tracks = false, start
     })
 
     if (status == 404) {
-        new Notification('Playlist not found', NotifType.Error)
+        new Notification(t('Requests.Playlists.NotFound'), NotifType.Error)
     }
 
     if (data) {
@@ -87,11 +90,11 @@ export async function addItemToPlaylist(playlist: Playlist, props: {}) {
     })
 
     if (status == 409) {
-        new Notification('Track already exists in playlist', NotifType.Error)
+        new Notification(t('Requests.Playlists.TrackAlreadyPresent'), NotifType.Error)
         return false
     }
 
-    new Notification('Added to ' + playlist.name)
+    new Notification(t('Requests.Playlists.AddedToPlaylist', {name: playlist.name}))
     return true
 }
 
@@ -139,16 +142,16 @@ export async function saveItemAsPlaylist(itemtype: string, props: {}) {
     const store = useToast()
 
     if (status === 201) {
-        store.showNotification('Playlist created successfully!', NotifType.Success)
+        store.showNotification(t('Requests.Playlists.CreatedSuccesfully'), NotifType.Success)
         return data.playlist as Playlist
     }
 
     if (status === 409) {
-        store.showNotification('Playlist already exists!', NotifType.Error)
+        store.showNotification(t('Requests.Playlists.AlreadyExists'), NotifType.Error)
         return false
     }
 
-    store.showNotification('Something went wrong!', NotifType.Error)
+    store.showNotification(t('Common.NotificationError'), NotifType.Error)
     return false
 }
 
@@ -200,13 +203,13 @@ export async function updatePlaylist(pid: number, playlist: FormData, pStore: an
     })
 
     if (status == 400) {
-        new Notification('Failed: Unsupported image', NotifType.Error)
+        new Notification(t('Requests.Playlists.ErrUnsupportedImage'), NotifType.Error)
         return
     }
 
     if (data) {
         pStore.updatePInfo(data.data)
-        new Notification('Playlist updated!')
+        new Notification(t('Requests.Playlists.Updated'))
     }
 }
 
@@ -224,7 +227,7 @@ export async function getPlaylistArtists(pid: number): Promise<Artist[]> {
     })
 
     if (error) {
-        new Notification('Something funny happened!', NotifType.Error)
+        new Notification(t('Common.NotificationFunnyError'), NotifType.Error)
     }
 
     if (data) {
@@ -241,7 +244,7 @@ export async function deletePlaylist(pid: number) {
     })
 
     if (status == 200) {
-        new Notification('Playlist deleted', NotifType.Success)
+        new Notification(t('Requests.Playlists.Deleted'), NotifType.Success)
     }
 }
 
@@ -254,11 +257,11 @@ export async function removeTracks(pid: number, tracks: { trackhash: string; ind
     })
 
     if (status === 200) {
-        new Notification('Tracks removed')
+        new Notification(t('Requests.Playlists.TrackRemoved'))
         return
     }
 
-    new Notification('Unable to remove tracks', NotifType.Error)
+    new Notification(t('Requests.Playlists.TrackRemovedError'), NotifType.Error)
 }
 
 export async function removeBannerImage(playlistid: number) {
@@ -268,11 +271,11 @@ export async function removeBannerImage(playlistid: number) {
     })
 
     if (status === 200) {
-        new Notification('Banner image removed')
+        new Notification(t('Requests.Playlists.BannerImageRemoved'))
         return data.playlist as Playlist
     }
 
-    new Notification('Unable to remove banner image', NotifType.Error)
+    new Notification(t('Requests.Playlists.BannerImageRemovedError'), NotifType.Error)
 }
 
 export async function pinUnpinPlaylist(pid: number) {
diff --git a/src/requests/settings/rootdirs.ts b/src/requests/settings/rootdirs.ts
index 2f89430f..3172b689 100644
--- a/src/requests/settings/rootdirs.ts
+++ b/src/requests/settings/rootdirs.ts
@@ -2,6 +2,9 @@ import { paths } from '@/config'
 import { Folder } from '@/interfaces'
 import { NotifType, useToast } from '@/stores/notification'
 import useAxios from '../useAxios'
+import { useT } from '@/i18n';
+
+const { t } = useT();
 
 const { add_root_dir, get_root_dirs, remove_root_dir } = paths.api.settings
 
@@ -25,12 +28,12 @@ export async function addRootDirs(new_dirs: string[], removed: string[]) {
     })
 
     if (error) {
-        useToast().showNotification('Error adding root dirs', NotifType.Error)
+        useToast().showNotification(t('Requests.RootDirs.ErrorAdding'), NotifType.Error)
         return []
     }
 
     useToast().showNotification(
-        'Root directories configured',
+        t('Requests.RootDirs.Success'),
         NotifType.Success
     )
 
@@ -44,7 +47,7 @@ export async function removeRootDirs(dirs: string[]) {
     })
 
     if (error) {
-        useToast().showNotification('Error removing root dirs', NotifType.Error)
+        useToast().showNotification(t('Requests.RootDirs.ErrorRemoving'), NotifType.Error)
     }
 }
 
@@ -69,9 +72,9 @@ export async function triggerScan() {
     })
 
     if (error) {
-        useToast().showNotification('Error triggering scan', NotifType.Error)
+        useToast().showNotification(t('Requests.RootDirs.ScanError'), NotifType.Error)
         return
     }
 
-    useToast().showNotification('Rescan started', NotifType.Success)
+    useToast().showNotification(t('Requests.RootDirs.ScanStarted'), NotifType.Success)
 }
diff --git a/src/settings/about/index.ts b/src/settings/about/index.ts
index e2b0ffa5..1ecea64c 100644
--- a/src/settings/about/index.ts
+++ b/src/settings/about/index.ts
@@ -1,15 +1,18 @@
 import { SettingType } from '../enums'
 import { SettingCategory } from '@/interfaces/settings'
+import { useT } from '@/i18n'
 
 import KeySvg from '@/assets/icons/key.svg?raw'
 import InfoSvg from '@/assets/icons/info.svg?raw'
 
+const { t } = useT()
+
 export default <SettingCategory>{
     groups: [
         {
-            title: 'License',
-            desc: 'Manage your license key, subscription and authorized devices',
-            displayName: 'License and Subscription',
+            title: t('Settings.About.LicenseTitle'),
+            desc: t('Settings.About.LicenseDesc'),
+            displayName: t('Settings.About.LicenseDisplayName'),
             icon: KeySvg,
             settings: [
                 {
@@ -18,7 +21,7 @@ export default <SettingCategory>{
             ],
         },
         {
-            title: 'About',
+            title: t("Settings.About.Title"),
             icon: InfoSvg,
             settings: [
                 {
diff --git a/src/settings/accounts/index.ts b/src/settings/accounts/index.ts
index 81706688..0a24bb55 100644
--- a/src/settings/accounts/index.ts
+++ b/src/settings/accounts/index.ts
@@ -4,11 +4,15 @@ import { SettingCategory } from '@/interfaces/settings'
 import AvatarSvg from '@/assets/icons/avatar.svg?raw'
 import { SettingType } from '../enums'
 
+import { useT } from '@/i18n'
+
+const { t } = useT()
+
 export default <SettingCategory>{
     show_if: loggedInUserIsAdmin,
     groups: [
         {
-            title: 'Accounts',
+            title: t("Settings.Accounts.Title"),
             icon: AvatarSvg,
             settings: [
                 {
diff --git a/src/settings/accounts/pairing.ts b/src/settings/accounts/pairing.ts
index c0bea53c..a2eabdc3 100644
--- a/src/settings/accounts/pairing.ts
+++ b/src/settings/accounts/pairing.ts
@@ -1,12 +1,15 @@
 import { SettingType } from '../enums'
 import AvatarSvg from '@/assets/icons/phone.svg?raw'
 import { SettingCategory } from '@/interfaces/settings'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 export default <SettingCategory>{
     groups: [
         {
-            title: 'Pair device',
-            desc: 'Login to the mobile client using QR code',
+            title: t("Settings.Pairing.Title"),
+            desc: t("Settings.Accounts.Desc"),
             icon: AvatarSvg,
             settings: [
                 {
diff --git a/src/settings/accounts/profile.ts b/src/settings/accounts/profile.ts
index 5f9b918d..65dc263a 100644
--- a/src/settings/accounts/profile.ts
+++ b/src/settings/accounts/profile.ts
@@ -1,11 +1,14 @@
 import { SettingCategory } from '@/interfaces/settings'
 import { SettingType } from '../enums'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 export default <SettingCategory>{
     groups: [
         {
-            title: 'Profile',
-            desc: 'Manage your profile and login information',
+            title: t('Settings.Profile.Title'),
+            desc: t('Settings.Profile.Desc'),
             settings: [
                 {
                     type: SettingType.profile,
diff --git a/src/settings/audio/groups.ts b/src/settings/audio/groups.ts
index b37d8dd5..78345452 100644
--- a/src/settings/audio/groups.ts
+++ b/src/settings/audio/groups.ts
@@ -1,26 +1,30 @@
 import { Setting } from '@/interfaces/settings'
 import settings from '@/stores/settings'
 import { SettingType } from '../enums'
+import { useT } from '@/i18n';
+
+const { t } = useT();
+
 
 // const use_legacy_streaming_endpoint: Setting = {
-//     title: 'Use legacy streaming',
-//     desc: 'Enable if you experience issues with playback',
+//     title: t('Settings.Audio.LegacyStreaming.Title'),
+//     desc: t("Settings.Audio.LegacyStreaming.Description"),
 //     type: SettingType.binary,
 //     state: () => settings().use_legacy_streaming_endpoint,
 //     action: () => settings().toggleUseLegacyStreamingEndpoint(),
 // }
 
 const use_silence: Setting = {
-    title: 'Silence padding removal',
-    desc: 'Automatically skip silence between tracks',
+    title: t("Settings.Audio.UseSilence.Title"),
+    desc: t("Settings.Audio.UseSilence.Description"),
     type: SettingType.binary,
     state: () => settings().use_silence_skip,
     action: () => settings().toggleUseSilenceSkip(),
 }
 
 const use_crossfade: Setting = {
-    title: 'Enable crossfade',
-    desc: 'Fade out the current track while fading in the next track',
+    title: t('Settings.Audio.UseCrossfade.Title'),
+    desc: t('Settings.Audio.UseCrossfade.Description'),
     type: SettingType.binary,
     state: () => settings().use_crossfade,
     action: () => settings().toggleCrossfade(),
@@ -29,8 +33,8 @@ const use_crossfade: Setting = {
 }
 
 const crossfade: Setting = {
-    title: 'Crossfade duration',
-    desc: 'Duration of the crossfade in seconds',
+    title: t('Settings.Audio.CrossfadeDuration.Title'),
+    desc: t('Settings.Audio.CrossfadeDuration.Description'),
     type: SettingType.locked_number_input,
     state: () => settings().crossfade_duration_seconds,
     action: (duration: number) => settings().setCrossfadeDuration(duration),
@@ -40,34 +44,34 @@ const crossfade: Setting = {
 
 // const streaming_quality_options = [
 //     {
-//         title: 'Original',
+//         title: t("Settings.Audio.StreamingQuality.Original"),
 //         key: 'original',
 //     },
 //     // {
-//     //     title: 'High (1024kbps) (FLAC)',
+//     //     title: t("Settings.Audio.StreamingQuality.1024Flac"),
 //     //     key: '1024',
 //     // },
 //     // {
-//     //     title: 'Medium (640kbps) (FLAC)',
+//     //     title: t("Settings.Audio.StreamingQuality.640Flac"),
 //     //     key: '640',
 //     // },
 //     {
-//         title: '320kbps',
+//         title: t('Settings.Audio.StreamingQuality.320'),
 //         key: '320',
 //     },
 //     {
-//         title: '128kbps',
+//         title: t("Settings.Audio.StreamingQuality.128"),
 //         key: '128',
 //     },
 //     {
-//         title: '96kbps',
+//         title: t("Settings.Audio.StreamingQuality.96"),
 //         key: '96',
 //     },
 // ]
 
 // const transcoding: Setting = {
-//     title: 'Streaming quality',
-//     desc: 'Choose the streaming quality of the music',
+//     title: t("Settings.Audio.StreamingQuality.Title"),
+//     desc: t("Settings.Audio.StreamingQuality.Description"),
 //     type: SettingType.streaming_quality,
 //     state: () => streaming_quality_options.find(option => option.key === settings().streaming_quality),
 //     action: (quality: {
diff --git a/src/settings/audio/index.ts b/src/settings/audio/index.ts
index 9b038503..f1696ff8 100644
--- a/src/settings/audio/index.ts
+++ b/src/settings/audio/index.ts
@@ -2,14 +2,17 @@ import { SettingCategory } from "@/interfaces/settings";
 import gapless from "./groups";
 
 import VolumeSvg from "@/assets/icons/volume-mid.svg?raw"
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 export default {
-  title: "Audio",
+  title: t("Settings.Audio.Title"),
   groups: [
     {
-      title: "Playback",
+      title: t("Settings.Audio.Playback"),
       icon: VolumeSvg,
-      desc: "Settings related to audio playback",
+      desc: t("Settings.Audio.PlaybackDesc"),
       settings: [...gapless],
     },
   ],
diff --git a/src/settings/general/albums.ts b/src/settings/general/albums.ts
index d7e97fd5..e21c3a7f 100644
--- a/src/settings/general/albums.ts
+++ b/src/settings/general/albums.ts
@@ -2,20 +2,23 @@ import { Setting } from '@/interfaces/settings'
 import { SettingType } from '../enums'
 
 import useSettingsStore from '@/stores/settings'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const settings = useSettingsStore
 
 const clean_album_titles: Setting = {
-    title: 'Clean album titles',
-    desc: 'Remove bracketed text from titles and process it separately if possible',
+    title: t("Settings.General.Albums.CleanTitles.Title"),
+    desc: t("Settings.General.Albums.CleanTitles.Description"),
     type: SettingType.binary,
     state: () => settings().clean_titles,
     action: () => settings().toggleCleanAlbumTitle(),
 }
 
 const merge_album_versions: Setting = {
-    title: 'Merge album versions',
-    desc: 'All versions of the same album will be merged into one album',
+    title: t("Settings.General.Albums.MergeAlbum.Title"),
+    desc: t("Settings.General.Albums.MergeAlbum.Description"),
     type: SettingType.binary,
     state: () => {
         const settings = useSettingsStore()
@@ -26,8 +29,8 @@ const merge_album_versions: Setting = {
 }
 
 const show_albums_as_singles: Setting = {
-    title: 'Mark albums with one track as singles',
-    desc: 'Require an album to have at least two tracks',
+    title: t('Settings.General.Albums.AlbumAsSingles.Title'),
+    desc: t("Settings.General.Albums.AlbumAsSingles.Description"),
     type: SettingType.binary,
     state: () => settings().show_albums_as_singles,
     action: () => settings().toggleShowAlbumsAsSingles(),
diff --git a/src/settings/general/artists.ts b/src/settings/general/artists.ts
index 5742747f..1e468814 100644
--- a/src/settings/general/artists.ts
+++ b/src/settings/general/artists.ts
@@ -3,10 +3,13 @@ import { SettingType } from '../enums'
 
 import useSettingsStore from '@/stores/settings'
 import { updateConfig } from '@/requests/settings'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const separators = <Setting>{
-    title: 'Enter separators separated by a comma',
-    desc: `These will be used to separate artists and album artists`,
+    title: t('Settings.General.Artists.SeparatorTitle'),
+    desc: t('Settings.General.Artists.SeparatorDesc'),
     state: () => {
         const store = useSettingsStore()
 
@@ -33,8 +36,8 @@ const separators = <Setting>{
 }
 
 const articleAwareSorting = <Setting>{
-    title: 'Article aware sorting',
-    desc: "Ignore articles (e.g. The, A, An) when sorting artist names",
+    title: t('Settings.General.Artists.ArticleAwareTitle'),
+    desc: t('Settings.General.Artists.ArticleAwareDesc'),
     type: SettingType.binary,
     state: () => useSettingsStore().article_aware_sorting,
     action: () => useSettingsStore().toggleArticleAwareSorting(),
diff --git a/src/settings/general/backup.ts b/src/settings/general/backup.ts
index 070463e7..2321c922 100644
--- a/src/settings/general/backup.ts
+++ b/src/settings/general/backup.ts
@@ -1,9 +1,12 @@
 import { Setting } from '@/interfaces/settings'
 import { SettingType } from '../enums'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const automatic_backups: Setting = {
-    title: 'Automatic backups',
-    desc: 'Automatically backup your data, every 6 hours',
+    title: t("Settings.General.Backups.AutomaticBackups.Title"),
+    desc: t("Settings.General.Backups.AutomaticBackups.Description"),
     type: SettingType.binary,
     state: () => false,
     action: () => {},
@@ -11,8 +14,8 @@ const automatic_backups: Setting = {
 }
 
 const restore: Setting = {
-    title: 'Backup now',
-    desc: 'Backup directory: ~/swingmusic.backups',
+    title: t("Settings.General.Backups.BackupNow.Title"),
+    desc: t("Settings.General.Backups.BackupNow.Description"),
     type: SettingType.backup,
     state: () => true,
     action: () => {},
diff --git a/src/settings/general/circular-artist-img.ts b/src/settings/general/circular-artist-img.ts
index d512a4d8..0cfe0af3 100644
--- a/src/settings/general/circular-artist-img.ts
+++ b/src/settings/general/circular-artist-img.ts
@@ -1,3 +1,4 @@
+import { useT } from "@/i18n";
 import { SettingType } from "../enums";
 import { Setting } from "@/interfaces/settings";
 
@@ -5,11 +6,14 @@ import { isSmallPhone } from "@/stores/content-width";
 
 import useSettingsStore from "@/stores/settings";
 
+const { t } = useT();
+
+
 const settings = useSettingsStore;
 
 export default <Setting>{
-  title: "Simple artist page header",
-  desc: "Disable the default gradient layout and use a simple circular image",
+  title: t("Settings.General.CircularArtist.Title"),
+  desc: t("Settings.General.CircularArtist.Description"),
   type: SettingType.binary,
   state: () => settings().useCircularArtistImg,
   action: () => settings().toggleUseCircularArtistImg(),
diff --git a/src/settings/general/extend-width.ts b/src/settings/general/extend-width.ts
index f25b455b..91dacf55 100644
--- a/src/settings/general/extend-width.ts
+++ b/src/settings/general/extend-width.ts
@@ -8,7 +8,7 @@ const settings = useSettingsStore;
 
 const extend_to_full_width: Setting = {
   title: appWidthStrings.settings.extend,
-  desc: "Extend app to use all available screen width",
+  desc: appWidthStrings.settings.extend_desc,
   type: SettingType.binary,
   state: () => settings().extend_width,
   action: () => settings().toggleExtendWidth(),
diff --git a/src/settings/general/folderlistmode.ts b/src/settings/general/folderlistmode.ts
index 59cbe38f..5ec4a0b1 100644
--- a/src/settings/general/folderlistmode.ts
+++ b/src/settings/general/folderlistmode.ts
@@ -1,12 +1,15 @@
+import { useT } from "@/i18n";
 import { SettingType } from "../enums";
 import { Setting } from "@/interfaces/settings";
 
 import useSettings from "@/stores/settings";
 
+const { t } = useT();
+
 const settings = useSettings;
 
 const folder_list_mode: Setting = {
-  title: "Display folders in list mode",
+  title: t("Settings.General.FolderListMode.Title"),
   type: SettingType.binary,
   state: () => settings().folder_list_mode,
   action: () => settings().toggleFolderListMode(),
diff --git a/src/settings/general/index.ts b/src/settings/general/index.ts
index e4d3bcd6..aad4c907 100644
--- a/src/settings/general/index.ts
+++ b/src/settings/general/index.ts
@@ -23,7 +23,9 @@ import FolderSvg from '@/assets/icons/folder.svg?raw'
 import TrackSvg from '@/assets/icons/mic.svg?raw'
 import AppearanceSvg from '@/assets/icons/paintbrush.svg?raw'
 import CloudUploadSvg from '@/assets/icons/cloud-upload.svg?raw'
+import { useT } from '@/i18n'
 
+const { t } = useT()
 const npStrings = strings.nowPlayingStrings
 const rootRootStrings = strings.manageRootDirsStrings
 
@@ -31,8 +33,8 @@ export const general = {
     // title: 'General',
     groups: [
         {
-            title: 'Appearance',
-            desc: 'Settings for various parts of the user interface.',
+            title: t("Common.Appearance"),
+            desc: t("Settings.General.MainSettingsDescription"),
             icon: AppearanceSvg,
             settings: [
                 ...layout,
@@ -53,7 +55,7 @@ export const library = {
     show_if: loggedInUserIsAdmin,
     groups: [
         {
-            title: 'Folders',
+            title: t("Common.Folders"),
             icon: FolderSvg,
             desc: rootRootStrings.desc,
             settings: [...rootDirSettings],
@@ -61,31 +63,31 @@ export const library = {
         {
             // null means settings table is not created yet
             show_if: () => useSettings().feat !== null,
-            title: 'Tracks',
+            title: t("Common.Track", 2),
             icon: TrackSvg,
-            desc: 'Settings relating to track information',
+            desc: t("Settings.General.TrackInfoSettingsDesc"),
             settings: [...tracks],
         },
         {
             // null means settings table is not created yet
             show_if: () => useSettings().feat !== null,
-            title: 'Albums',
+            title: t("Common.Album", 2),
             icon: AlbumSvg,
-            desc: 'Settings relating to album information',
+            desc: t("Settings.General.AlbumInfoSettingsDesc"),
             settings: [...albums],
         },
         {
             // null means settings table is not created yet
             show_if: () => useSettings().feat !== null,
-            title: 'Artists',
+            title: t("Common.Artist", 2),
             icon: AvatarSvg,
-            desc: 'Customize artist settings',
+            desc: t("Settings.General.ArtistsDesc"),
             settings: [...artistSettings],
         },
         {
-            title: 'Backup',
+            title: t("Common.Backup"),
             icon: CloudUploadSvg,
-            desc: 'Backup and restore your library data',
+            desc: t("Settings.General.BackupMainDesc"),
             settings: [...restore],
         },
     ],
diff --git a/src/settings/general/layout.ts b/src/settings/general/layout.ts
index 246e2d82..e83396fd 100644
--- a/src/settings/general/layout.ts
+++ b/src/settings/general/layout.ts
@@ -1,12 +1,15 @@
+import { useT } from "@/i18n";
 import { SettingType } from "../enums";
 import { Setting } from "@/interfaces/settings";
 
 import useSettingsStore from "@/stores/settings";
 
+const { t } = useT();
+
 const settings = useSettingsStore;
 
 const use_alt_layout: Setting = {
-  title: "Use no sidebar layout",
+  title: t("Settings.General.UseNoSidebarTitle"),
   type: SettingType.binary,
   state: () => settings().is_alt_layout,
   action: () => settings().toggleLayout(),
diff --git a/src/settings/general/now-playing-group.ts b/src/settings/general/now-playing-group.ts
index bb63e575..5b1e5db3 100644
--- a/src/settings/general/now-playing-group.ts
+++ b/src/settings/general/now-playing-group.ts
@@ -1,12 +1,15 @@
+import { useT } from '@/i18n'
 import { SettingType } from '../enums'
 import { Setting } from '@/interfaces/settings'
 
 import useSettingsStore from '@/stores/settings'
 
+const { t } = useT()
+
 const settings = useSettingsStore
 
 const disable_np_img: Setting = {
-    title: 'Hide album art from the left sidebar',
+    title: t("Settings.General.NowPlaying.DisableNPTitle"),
     type: SettingType.binary,
     state: () => !settings().use_np_img,
     action: () => settings().toggleUseNPImg(),
@@ -14,24 +17,24 @@ const disable_np_img: Setting = {
 }
 
 const showNowPlayingOnTabTitle: Setting = {
-    title: 'Show Now Playing track on tab title',
-    desc: 'Replace current page info with Now Playing track info',
+    title: t("Settings.General.NowPlaying.OnTabTitle.Title"),
+    desc: t("Settings.General.NowPlaying.OnTabTitle.Description"),
     type: SettingType.binary,
     state: () => settings().nowPlayingTrackOnTabTitle,
     action: () => settings().toggleNowPlayingTrackOnTabTitle(),
 }
 
 const showInlineFavIcon: Setting = {
-    title: 'Show inline favorite icon',
-    desc: 'Show the favorite button next to the track duration',
+    title: t("Settings.General.NowPlaying.FavoriteInline.Title"),
+    desc: t('Settings.General.NowPlaying.FavoriteInline.Description'),
     type: SettingType.binary,
     state: () => settings().showInlineFavIcon,
     action: () => settings().toggleShowInlineFavIcon(),
 }
 
 const highlightFavoriteTracks: Setting = {
-    title: 'Highlight favorite tracks',
-    desc: 'Always show the favorite button for favorited tracks',
+    title: t("Settings.General.NowPlaying.HighlightFavorite.Title"),
+    desc: t("Settings.General.NowPlaying.HighlightFavorite.Description"),
     type: SettingType.binary,
     state: () => settings()._highlightFavoriteTracks,
     action: () => settings().toggleHighlightFavoriteTracks(),
diff --git a/src/settings/general/root-dirs.ts b/src/settings/general/root-dirs.ts
index e38f5957..56d24ab3 100644
--- a/src/settings/general/root-dirs.ts
+++ b/src/settings/general/root-dirs.ts
@@ -6,6 +6,9 @@ import { manageRootDirsStrings as data } from '../strings'
 import useModalStore from '@/stores/modal'
 import settings from '@/stores/settings'
 import { router, Routes } from '@/router'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const text = data.settings
 
@@ -13,7 +16,7 @@ const change_root_dirs: Setting = {
     title: text.change,
     type: SettingType.button,
     state: null,
-    button_text: () => `\xa0 \xa0 ${settings().root_dirs.length ? 'Update' : 'Configure'} \xa0 \xa0`,
+    button_text: () => `\xa0 \xa0 ${settings().root_dirs.length ? t("Common.Modify") : t("Common.Configure")}} \xa0 \xa0`,
     action: () => {
         useModalStore().hideModal()
         return router.push({ path: '/manconfig/dirconfig' })
@@ -37,22 +40,22 @@ const list_root_dirs: Setting = {
 }
 
 const show_playlists_in_folders: Setting = {
-    title: 'Show playlists in folder view',
-    desc: 'Browse playlists and favorites in folders screen (meant for mobile app)',
+    title: t("Settings.General.RootDirs.ShowPlaylistInFolders.Title"),
+    desc: t("Settings.General.RootDirs.ShowPlaylistInFolders.Description"),
     type: SettingType.binary,
     state: () => settings().show_playlists_in_folders,
     action: () => settings().toggleShowPlaylistsInFolders(),
 }
 
 // const enable_scans: Setting = {
-//   title: "Enable periodic scans",
+//   title: t("Settings.General.RootDirs.EnablePeriodicScans"),
 //   type: SettingType.binary,
 //   state: () => useSettingsStore().enablePeriodicScans,
 //   action: () => useSettingsStore().togglePeriodicScans(),
 // };
 
 // const useWatchdog: Setting = {
-//   title: "Watch root dirs for new music",
+//   title: t("Settings.General.RootDirs.UseWatchdog"),
 //   experimental: true,
 //   type: SettingType.binary,
 //   state: () => useSettingsStore().enableWatchDog,
@@ -60,7 +63,7 @@ const show_playlists_in_folders: Setting = {
 // };
 
 // const periodicScanInterval: Setting = {
-//   title: "Periodic scan interval (minutes)",
+//   title: t("Settings.General.RootDirs.PeriodicScanInterval"),
 //   type: SettingType.free_number_input,
 //   state: () => useSettingsStore().periodicInterval,
 //   action: (newValue: number) => useSettingsStore().updatePeriodicInterval(newValue),
diff --git a/src/settings/general/sidebar.ts b/src/settings/general/sidebar.ts
index 065cc528..87bfc164 100644
--- a/src/settings/general/sidebar.ts
+++ b/src/settings/general/sidebar.ts
@@ -1,3 +1,4 @@
+import { useT } from "@/i18n";
 import { SettingType } from "../enums";
 import { Setting } from "@/interfaces/settings";
 
@@ -5,9 +6,11 @@ import useSettingsStore from "@/stores/settings";
 
 const settings = useSettingsStore;
 
+const { t } = useT();
+
 const use_sidebar: Setting = {
-  title: "Toggle right sidebar",
-  desc: "CTRL + B",
+  title: t("Settings.General.Sidebar.Title"),
+  desc: t("Settings.General.Sidebar.Description"),
   type: SettingType.binary,
   state: () => settings().use_sidebar,
   action: () => settings().toggleDisableSidebar(),
diff --git a/src/settings/general/tracks.ts b/src/settings/general/tracks.ts
index 977490fb..28a3dc5e 100644
--- a/src/settings/general/tracks.ts
+++ b/src/settings/general/tracks.ts
@@ -2,28 +2,31 @@ import { Setting } from "@/interfaces/settings";
 import { SettingType } from "../enums";
 
 import useSettingsStore from "@/stores/settings";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const settings = useSettingsStore;
 
 const process_featured_artists: Setting = {
-  title: "Featured artists",
-  desc: "Remove featured artists from titles and merge them with other artists",
+  title: t("Settings.General.Tracks.ProcessFeatArtists.Title"),
+  desc: t("Settings.General.Tracks.ProcessFeatArtists.Description"),
   type: SettingType.binary,
   state: () => settings().feat,
   action: () => settings().toggleExtractFeaturedArtists(),
 };
 
 const remove_prod_by: Setting = {
-  title: "Hide 'prod.'",
-  desc: "Remove 'prod.' from track titles",
+  title: t("Settings.General.Tracks.RemoveProd.Title"),
+  desc: t("Settings.General.Tracks.RemoveProd.Description"),
   type: SettingType.binary,
   state: () => settings().prodby,
   action: () => settings().toggleRemoveProdBy(),
 };
 
 const remove_remaster_info_from_titles: Setting = {
-  title: "Hide remaster info",
-  desc: "Remove remaster information from track titles if possible",
+  title: t("Settings.General.Tracks.HideRemaster.Title"),
+  desc: t("Settings.General.Tracks.HideRemaster.Description"),
   type: SettingType.binary,
   state: () => settings().hide_remaster,
   action: () => settings().toggleRemoveRemasterInfo(),
diff --git a/src/settings/plugins/index.ts b/src/settings/plugins/index.ts
index 40e876b7..f9dcfffe 100644
--- a/src/settings/plugins/index.ts
+++ b/src/settings/plugins/index.ts
@@ -5,22 +5,25 @@ import { SettingCategory } from '@/interfaces/settings'
 
 import LyricsSvg from '@/assets/icons/lyrics.svg?raw'
 import LastfmSvg from '@/assets/icons/lastfm.svg?raw'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 export default <SettingCategory>{
-    title: 'Plugins',
+    title: t("Common.Plugins"),
     show_if: loggedInUserIsAdmin,
     groups: [
         {
-            title: 'Lyrics',
+            title: t("Common.Lyrics"),
             icon: LyricsSvg,
-            desc: 'Finds and displays lyrics from the internet.',
+            desc: t("Settings.Plugins.LyricsDescription"),
             settings: lyrics,
             experimental: true,
         },
         {
-            title: 'Last.fm',
+            title: t("Settings.Plugins.LastFM.Title"),
             icon: LastfmSvg,
-            desc: 'Scrobble your music to Last.fm',
+            desc: t('Settings.Plugins.LastFM.Description'),
             settings: lastfm,
         },
     ],
diff --git a/src/settings/plugins/lastfm.ts b/src/settings/plugins/lastfm.ts
index b2cb8518..c87f9956 100644
--- a/src/settings/plugins/lastfm.ts
+++ b/src/settings/plugins/lastfm.ts
@@ -1,10 +1,13 @@
 import useSettings from '@/stores/settings'
 import { Setting } from '@/interfaces/settings'
 import { SettingType } from '../enums'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const authorize = <Setting>{
-    title: 'Connect your account',
-    desc: 'Allow Swing Music to access your Last.fm account',
+    title: t("Settings.Plugins.LastFM.Authorize.Title"),
+    desc: t("Settings.Plugins.LastFM.Authorize.Description"),
     type: SettingType.button,
     action: () => {
         const settings = useSettings()
@@ -21,20 +24,20 @@ const authorize = <Setting>{
     button_text: () => {
         const settings = useSettings()
         if (settings.lastfm_integration_started) {
-            return 'Finish'
+            return t("Common.Finish")
         }
 
         if (settings.lastfm_session_key) {
-            return 'Disconnect'
+            return t("Common.Disconnect")
         }
 
-        return 'Connect'
+        return t("Common.Connect")
     },
 }
 
 // const api_key = <Setting>{
-//     title: 'Use custom API Key',
-//     desc: 'instead of the Swing Music default to authenticate with Last.fm',
+//     title: t("Settings.Plugins.LastFM.ApiKey.Title"),
+//     desc: t("Settings.Plugins.LastFM.ApiKey.Description"),
 //     type: SettingType.secretinput,
 //     state: () => useSettings().lastfm_api_key,
 //     action: (value: string) => {
@@ -46,8 +49,8 @@ const authorize = <Setting>{
 // }
 
 // const api_secret = <Setting>{
-//     title: 'Use custom API Secret',
-//     desc: 'instead of the Swing Music default to sign your scrobble submission',
+//     title: t("Settings.Plugins.LastFM.ApiSecret.Title"),
+//     desc: t("Settings.Plugins.LastFM.ApiSecret.Description")'',
 //     type: SettingType.secretinput,
 //     state: () => useSettings().lastfm_api_secret,
 //     action: (value: string) => {
diff --git a/src/settings/plugins/lyrics.ts b/src/settings/plugins/lyrics.ts
index a76b58b9..9e2845a9 100644
--- a/src/settings/plugins/lyrics.ts
+++ b/src/settings/plugins/lyrics.ts
@@ -2,17 +2,20 @@ import { Setting } from '@/interfaces/settings'
 import { SettingType } from '../enums'
 
 import useSettings from '@/stores/settings'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const toggle_lyrics_plugin = <Setting>{
-    title: 'Enable plugin',
+    title: t("Settings.Plugins.Lyrics.ToggleLyrics.Title"),
     type: SettingType.binary,
     state: () => useSettings().use_lyrics_plugin,
     action: () => useSettings().toggleLyricsPlugin(),
 }
 
 const auto_download_lyrics = <Setting>{
-    title: 'Auto download lyrics',
-    desc: 'Automatically download missing lyrics when you are on the lyrics page',
+    title: t("Settings.Plugins.Lyrics.AutoDownload.Title"),
+    desc:  t("Settings.Plugins.Lyrics.AutoDownload.Description"),
     type: SettingType.binary,
     state: () => useSettings().lyrics_plugin_settings.auto_download,
     action: () => useSettings().toggleLyricsAutoDownload(),
@@ -20,8 +23,8 @@ const auto_download_lyrics = <Setting>{
 }
 
 const auto_download_on_unsynced = <Setting>{
-    title: 'Overide unsynced lyrics',
-    desc: 'Automatically download lyrics even if unsynced lyrics are locally available',
+    title: t("Settings.Plugins.Lyrics.OverrideLocal.Title"),
+    desc: t("Settings.Plugins.Lyrics.OverrideLocal.Description"),
     type: SettingType.binary,
     state: () => useSettings().lyrics_plugin_settings.overide_unsynced,
     action: () => useSettings().toggleLyricsOverideUnsynced(),
@@ -32,8 +35,8 @@ const auto_download_on_unsynced = <Setting>{
 }
 
 const trust_cloud_lyrics = <Setting>{
-    title: 'Only display verified lyrics',
-    desc: 'Do not show lyrics unverified lyrics (premium required)',
+    title: t('Settings.Plugins.Lyrics.TrustCloud.Title'),
+    desc: t('Settings.Plugins.Lyrics.TrustCloud.Desc'),
     type: SettingType.binary,
     state: () => useSettings().trust_cloud_lyrics,
     action: () => useSettings().toggleTrustCloudLyrics(),
diff --git a/src/settings/strings.ts b/src/settings/strings.ts
index f6526926..ec5e24e9 100644
--- a/src/settings/strings.ts
+++ b/src/settings/strings.ts
@@ -1,6 +1,11 @@
 /**
  * Settings data strings
  */
+
+import { useT } from "@/i18n";
+
+const { t } = useT();
+
 interface S {
   title?: string;
   desc?: string;
@@ -10,46 +15,47 @@ interface S {
 }
 
 export const nowPlayingStrings = {
-  title: "Now playing",
-  desc: "Settings relating to the current song",
+  title: t('Settings.NowPlaying.Title'),
+  desc: t("Settings.NowPlaying.Description"),
   settings: {
-    album_art: "Show album art on the left sidebar",
+    album_art: t('Settings.NowPlaying.AlbumArt'),
   },
 } as S;
 
 export const appWidthStrings = {
   settings: {
-    extend: "Full width",
+    extend: t("Settings.AppWidth.Extend"),
+    extend_desc: t("Settings.AppWidth.ExtendDesc")
   },
 } as S;
 
 export const sidebarStrings = <S>{
   settings: {
-    use_sidebar: "Show right sidebar",
+    use_sidebar: t("Settings.Sidebar.UseSidebar"),
   },
 };
 
 export const contextChildrenShowModeStrings = <S>{
   settings: {
-    show_mode: "Show right click menu dropdowns on",
+    show_mode: t('Settings.ContextChildren.ShowMode'),
   },
 };
 
 export const showMasterFlag = <S>{
   settings: {
-    show_flag: "Master flag",
+    show_flag: t('Settings.MasterFlag.Show'),
   },
 };
 
 export const showFoldersAsStrings = <S>{
-  settings: { show_folders_as: "Show folders as" },
+  settings: { show_folders_as: t("Settings.ShowFolders.As")},
 };
 
 export const manageRootDirsStrings = <S>{
-  title: "Root directories",
-  desc: "Settings relating to your root directories",
+  title: t("Settings.RootDirs.Title"),
+  desc: t("Settings.RootDirs.Description"),
   settings: {
-    change: "Change your root directories",
-    list_root_dirs: "Current root directories",
+    change: t("Settings.RootDirs.Change"),
+    list_root_dirs: t("Settings.RootDirs.Current"),
   },
 };
diff --git a/src/stores/auth.ts b/src/stores/auth.ts
index 4ae5a9ec..60cc5e8a 100644
--- a/src/stores/auth.ts
+++ b/src/stores/auth.ts
@@ -12,6 +12,10 @@ import {
     updateUserProfile,
 } from '@/requests/auth'
 import { NotifType, useToast } from '@/stores/notification'
+import { useT } from '@/i18n'
+
+const { t } = useT()
+
 
 export default defineStore('authStore', {
     state: () => ({
@@ -39,7 +43,7 @@ export default defineStore('authStore', {
             this.showToast(msg, NotifType.Error)
         },
         showGenericError() {
-            this.showError('Failed! Something went wrong!')
+            this.showError(t("Common.NotificationError"))
         },
         showResMsgOrGenericError(res: any) {
             if (res.data.msg) {
@@ -69,7 +73,7 @@ export default defineStore('authStore', {
             const res = await addNewUser(user)
 
             if (res.status === 200) {
-                this.showSuccess('User added successfully!')
+                this.showSuccess(t('Stores.Auth.UserAddedSucc'))
 
                 return res.data as User
             }
@@ -80,7 +84,7 @@ export default defineStore('authStore', {
         async addGuestUser() {
             const res = await addGuestUser()
             if (res.status === 200) {
-                this.showSuccess('Guest user added successfully!')
+                this.showSuccess(t('Stores.Auth.GuestUserAdded'))
                 return true
             }
 
@@ -97,7 +101,7 @@ export default defineStore('authStore', {
                 if (!user.id || user.id === this.user.id) {
                     this.user = res.data
                 }
-                this.showSuccess('Profile updated successfully!')
+                this.showSuccess(t('Stores.Auth.ProfileUpdated'))
                 return true
             }
 
@@ -108,7 +112,7 @@ export default defineStore('authStore', {
             const res = await deleteUser(username)
 
             if (res.status === 200) {
-                this.showSuccess(`${username} deleted successfully!`)
+                this.showSuccess(t('Stores.Auth.UserDeleted', {user: username}))
                 return true
             }
 
diff --git a/src/stores/notification.ts b/src/stores/notification.ts
index d18b1678..e9053fc2 100644
--- a/src/stores/notification.ts
+++ b/src/stores/notification.ts
@@ -1,6 +1,9 @@
 import { defineStore } from "pinia";
 import { NotifType } from "../enums";
 import { Notif } from "../interfaces";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const useToast = defineStore("notification", {
   state: () => ({
@@ -24,7 +27,7 @@ const useToast = defineStore("notification", {
       this.showNotification(text, NotifType.Success);
     },
     showGenericError(){
-      this.showError("Failed! Something went wrong!")
+      this.showError(t("Common.NotificationError"))
     }
   },
 });
diff --git a/src/stores/player.ts b/src/stores/player.ts
index 86f34938..7083e106 100644
--- a/src/stores/player.ts
+++ b/src/stores/player.ts
@@ -13,6 +13,9 @@ import useTracker from './tracker'
 import { getBaseUrl, paths } from '@/config'
 import updateMediaNotif from '@/helpers/mediaNotification'
 import { crossFade } from '@/utils/audio/crossFade'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 class AudioSource {
     private sources: HTMLAudioElement[] = []
@@ -235,16 +238,16 @@ export const usePlayer = defineStore('player', () => {
             if (e.name === 'NotAllowedError') {
                 queue.playPause()
                 return toast.showNotification(
-                    'Tap anywhere in the page and try again (autoplay blocked)',
+                    t('Stores.Player.AutoplayBlockedError'),
                     NotifType.Error
                 )
             }
 
-            return toast.showNotification('Player Error: ' + e.message, NotifType.Error)
+            return toast.showNotification(t("Stores.Player.PlayerErrorWithArg", {msg: e.message}), NotifType.Error)
         }
 
         // queue.playNext() // skip unplayable track
-        toast.showNotification("Can't load: " + queue.currenttrack.title, NotifType.Error)
+        toast.showNotification(t("Stores.Player.LoadErrorWithArg", {queue: queue.currenttrack.title}), NotifType.Error)
     }
 
     const runActionsOnPlay = () => {
diff --git a/src/stores/queue.ts b/src/stores/queue.ts
index 97616b64..e80f728a 100644
--- a/src/stores/queue.ts
+++ b/src/stores/queue.ts
@@ -12,6 +12,9 @@ import useLyrics from './lyrics'
 import { NotifType, useToast } from './notification'
 import useTracklist from './queue/tracklist'
 import useSettings from './settings'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 export default defineStore('Queue', {
     state: () => ({
@@ -150,7 +153,7 @@ export default defineStore('Queue', {
 
             const nextindex = this.currentindex + 1
             insertAt([track], nextindex)
-            Toast.showNotification(`Added 1 track to queue`, NotifType.Success)
+            Toast.showNotification(t("Stores.Queue.AddedTrack"), NotifType.Success)
         },
         clearQueue() {
             const store = useTracklist()
diff --git a/src/stores/queue/tracklist.ts b/src/stores/queue/tracklist.ts
index 3c20f3b8..f26f7f69 100644
--- a/src/stores/queue/tracklist.ts
+++ b/src/stores/queue/tracklist.ts
@@ -8,6 +8,10 @@ import useSettings from '@/stores/settings'
 
 import { FromOptions } from '@/enums'
 import { fromAlbum, fromArtist, fromFav, fromFolder, fromMix, fromPlaylist, fromSearch, Track } from '@/interfaces'
+import track from '@/context_menus/track'
+import { useT } from '@/i18n'
+
+const { t } = useT();
 
 export type From = fromFolder | fromAlbum | fromPlaylist | fromSearch | fromArtist | fromFav | fromMix
 
@@ -121,7 +125,7 @@ export default defineStore('tracklist', {
             this.insertAt(tracks, this.tracklist.length)
 
             const Toast = useToast()
-            Toast.showNotification(`Added ${tracks.length} tracks to queue`, NotifType.Success)
+            Toast.showNotification(t("Stores.Tracklist.AddTrackToQueue", {n: tracks.length}, tracks.length), NotifType.Success)
         },
         insertAt(tracks: Track[], index: number) {
             this.tracklist.splice(index, 0, ...tracks)
@@ -181,7 +185,7 @@ export default defineStore('tracklist', {
             this.tracklist.splice(currentindex + 1, 0, ...tracks)
 
             const Toast = useToast()
-            Toast.showNotification(`Added ${tracks.length} tracks to queue`, NotifType.Success)
+            Toast.showNotification(t("Stores.Tracklist.AddTrackToQueue", {n: tracks.length}, tracks.length), NotifType.Success)
         },
     },
     getters: {
diff --git a/src/utils/dates.ts b/src/utils/dates.ts
index a7678d8d..76f89940 100644
--- a/src/utils/dates.ts
+++ b/src/utils/dates.ts
@@ -1,7 +1,11 @@
 /**
- * Formats a timestamp into a date string of the format "Month day, year"
+ * Formats a timestamp into a date string of the locale format 
+ * requested by the user.
  * @returns formatted date
  */
+
+import { locale } from "@/i18n"
+
 export function formatDate(timestamp: number, yearOnly = false) {
     // format date as Month day, year
     const date = new Date(timestamp * 1000)
@@ -12,5 +16,6 @@ export function formatDate(timestamp: number, yearOnly = false) {
         return date.getFullYear()
     }
 
-    return date.toLocaleDateString('en-US', options)
+    // Replace _ to - in order to make them BCP47/RCF5646 compliant language tags.
+    return date.toLocaleDateString(locale.replace('_', '-'), options)
 }
diff --git a/src/utils/index.ts b/src/utils/index.ts
index f06d2a67..896ef11d 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -7,17 +7,6 @@ import putCommas from './usePutCommas'
 import useVisibility from './useVisibility'
 import useCreateTrackProps from './useCreateTrackProps'
 
-/**
- * Pluralizes an english word
- *
- * @param word The english word to pluralize
- * @param count The number of items
- * @returns The pluralized word
- */
-export function pruralize(word: string, count: number): string {
-    return count !== 1 ? `${word}s` : word
-}
-
 export {
     readLocalStorage,
     writeLocalStorage,
diff --git a/src/utils/playingFrom.ts b/src/utils/playingFrom.ts
index 95e634c0..c23e7d65 100644
--- a/src/utils/playingFrom.ts
+++ b/src/utils/playingFrom.ts
@@ -13,6 +13,9 @@ import HeartSvg from '@/assets/icons/heart.fill.svg'
 import PlaylistSvg from '@/assets/icons/playlist.svg'
 import SearchSvg from '@/assets/icons/search.svg'
 import RadioSvg from '@/assets/icons/radio.svg'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 interface PlayingFrom {
     name: string
@@ -64,7 +67,7 @@ export default (source: From): PlayingFrom => {
 
         case FromOptions.search:
             return {
-                name: `Search for: "${source.query}"`,
+                name: t('Utils.PlayingFrom.SearchFrom', {source: source.query}),
                 icon: SearchSvg,
                 location: {
                     name: Routes.search,
@@ -93,7 +96,7 @@ export default (source: From): PlayingFrom => {
 
         case FromOptions.favorite:
             return {
-                name: 'Favorite Tracks',
+                name: t('Utils.PlayingFrom.FavoriteTracks'),
                 icon: HeartSvg,
                 location: {
                     name: Routes.favoriteTracks,
@@ -121,6 +124,6 @@ export default (source: From): PlayingFrom => {
             }
 
         default:
-            return { name: '👻 No source', location: {}, icon: '' }
+            return { name: t('Utils.PlayingFrom.NoSource'), location: {}, icon: '' }
     }
 }
diff --git a/src/utils/updatePageTitle.ts b/src/utils/updatePageTitle.ts
index fdc64fe7..bf7834bb 100644
--- a/src/utils/updatePageTitle.ts
+++ b/src/utils/updatePageTitle.ts
@@ -1,12 +1,15 @@
+import { useT } from '@/i18n'
 import useSettings from '@/stores/settings'
 
+const { t } = useT()
+
 export default (title: string, isNowPlayingInfo: boolean = false) => {
     const settings = useSettings()
     if (settings.nowPlayingTrackOnTabTitle && !isNowPlayingInfo) {
         return
     }
 
-    const base = 'Swing Music'
+    const base = t('Common.AppTitle')
 
     if (title) {
         document.title = `${title} | ${base}`
diff --git a/src/utils/useFormatSeconds.ts b/src/utils/useFormatSeconds.ts
index c2d4c4da..4c3a141a 100644
--- a/src/utils/useFormatSeconds.ts
+++ b/src/utils/useFormatSeconds.ts
@@ -1,3 +1,7 @@
+import { useT } from "@/i18n";
+
+const { t } = useT()
+
 function padNumber(number: number) {
   return ("0" + number).slice(-2);
 }
@@ -25,11 +29,11 @@ export default function formatSeconds(
 
   if (long == true) {
     if (mm < 1 && hh < 1 && ss > 0) {
-      return `${_ss} Seconds`;
+      return t('Utils.FormatTime.Second', { sec: _ss }, ss);
     }
 
-    _hh = `${hh} hr${hh > 1 ? "s" : ""}`;
-    _mm = `${mm} minute${mm > 1 ? "s" : ""}`;
+    _hh = t('Utils.FormatTime.Hour', { hrs: hh }, hh);
+    _mm = t('Utils.FormatTime.Minute', { mnt: mm }, mm);
 
     if (hh > 0) {
       return `${_hh}, ${_mm}`;
diff --git a/src/views/AlbumListView/Header.vue b/src/views/AlbumListView/Header.vue
index a7ba8ebd..37a5055a 100644
--- a/src/views/AlbumListView/Header.vue
+++ b/src/views/AlbumListView/Header.vue
@@ -1,14 +1,16 @@
 <template>
   <div class="albumlistviewhead">
     <GenericHeader>
-      <template #name>{{
-        (is_albumlist ? "Album" : "Artist") + (is_not_one ? "s" : "")
+      <template #name>{{ $t('Common.Album', props.total)
       }}</template>
       <template #description>
-        You have {{ total.toLocaleString() }}
-        {{ (is_albumlist ? "album" : "artist") + (is_not_one ? "s" : "") }} in
-        your library</template
-      >
+        {{ $t('Views.Header.TotalAlbumAndArtists',
+          {
+            tot: total.toLocaleString(), 
+            what: is_albumlist ? $t('Common.Album', props.total) : $t('Common.Artist', props.total)
+          })
+        }}
+        </template>
     </GenericHeader>
   </div>
 </template>
@@ -26,5 +28,4 @@ const props = defineProps<{
 const route = useRoute();
 
 const is_albumlist = computed(() => route.name == Routes.AlbumList);
-const is_not_one = computed(() => props.total !== 1);
 </script>
diff --git a/src/views/AlbumView/index.vue b/src/views/AlbumView/index.vue
index 7ac41870..13049965 100644
--- a/src/views/AlbumView/index.vue
+++ b/src/views/AlbumView/index.vue
@@ -47,6 +47,9 @@ import Stats from '@/components/Stats/Stats.vue'
 
 import { dropSources } from '@/enums'
 import { isSmall } from '@/stores/content-width'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const album = useAlbumStore()
 const queue = useQueueStore()
@@ -141,7 +144,7 @@ function getArtistAlbumComponents(): ScrollerItem[] {
                     type: 'album',
                     item: album,
                 })),
-                title: `More from ${artistname}`,
+                title: t('Views.AlbumViews.MoreFrom', {art: artistname}),
                 route: `/artists/${artisthash}/discography/all?artist=${artistname}`,
             },
         }
@@ -164,7 +167,7 @@ function getAlbumVersionsComponent(): ScrollerItem | null {
                 type: 'album',
                 item: album,
             })),
-            title: 'Other versions',
+            title: t('Views.AlbumViews.OtherVersions'),
             child_props: {
                 hide_artists: true,
             },
@@ -213,7 +216,7 @@ const scrollerItems = computed(() => {
             id: 'similarAlbums',
             component: CardScroller,
             props: {
-                title: 'Related Albums',
+                title: t('Views.AlbumViews.RelatedAlbums'),
                 items: album.similarAlbums.map(i => ({
                     type: 'album',
                     item: i,
diff --git a/src/views/ArtistDiscography.vue b/src/views/ArtistDiscography.vue
index 7e94597b..02f72fba 100644
--- a/src/views/ArtistDiscography.vue
+++ b/src/views/ArtistDiscography.vue
@@ -45,10 +45,10 @@
     </div>
     <NoItems
       v-else
-      :title="'No contributions'"
+      :title="$t('Views.ArtistDiscography.NoContributions')"
       :flag="!artist.toShow.length"
       :icon="AlbumSvg"
-      :description="`No ${getTypeName($route.params.type)} found for ${route.query.artist}`"
+      :description="$t('Views.ArtistDiscography.NoContributionsDesc', {type: getTypeName($route.params.type), artist: route.query.artist})"
     />
   </div>
 </template>
@@ -67,23 +67,25 @@ import AlbumCard from "@/components/shared/AlbumCard.vue";
 import GenericHeader from "@/components/shared/GenericHeader.vue";
 import GenericTabs from "@/components/shared/GenericTabs.vue";
 import NoItems from "@/components/shared/NoItems.vue";
+import { useT } from "@/i18n";
 
+const { t } = useT();
 const route = useRoute();
 const artist = useArtistDiscography();
 
 function getTypeString(type: string) {
-  if (type === "all") return "Contributions";
+  if (type === "all") return t('Views.ArtistDiscography.Contributions');
   return getTypeName(type);
 }
 
 function getTypeName(type: string | string[]) {
   // @ts-ignore
-  if (type == "all") return "All Albums";
+  if (type == "all") return t('Views.ArtistDiscography.AllAlbums');
   return type;
 }
 
 onMounted(() => {
-  updatePageTitle("Discography" + (route.params.artist || ""));
+  updatePageTitle(t("Common.Discography", {artist: route.params.artist || ""}));
   artist.fetchAlbums(route.params.hash as string);
 });
 
diff --git a/src/views/ArtistView/Main.vue b/src/views/ArtistView/Main.vue
index ea7bb4ce..b49f7454 100644
--- a/src/views/ArtistView/Main.vue
+++ b/src/views/ArtistView/Main.vue
@@ -42,6 +42,9 @@ import Header from '@/components/ArtistView/Header.vue'
 import TopTracks from '@/components/ArtistView/TopTracks.vue'
 import CardScroller from '@/components/shared/CardScroller.vue'
 import Stats from '@/components/Stats/Stats.vue'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const route = useRoute()
 
@@ -92,6 +95,21 @@ enum AlbumType {
     COMPILATIONS = 'Compilations',
 }
 
+function resolveTitleFromEnum(type: AlbumType): string {
+    switch (type) {
+        case AlbumType.ALBUMS:
+            return t('Common.Album', 2);
+        case AlbumType.APPEARANCES:
+            return t('Common.Appearances');
+        case AlbumType.COMPILATIONS:
+            return t('Common.Compilations', 2);
+        case AlbumType.SINGLES:
+            return t('Common.Singles');
+        default:
+            return '';
+    }
+}
+
 function createAbumComponent(title: AlbumType, albums: Album[], show_date = true) {
     let albumType = null
 
@@ -116,7 +134,7 @@ function createAbumComponent(title: AlbumType, albums: Album[], show_date = true
         id: title,
         component: CardScroller,
         props: {
-            title,
+            title: resolveTitleFromEnum(title),
             items: albums.map(album => ({
                 type: 'album',
                 item: album,
@@ -137,7 +155,7 @@ function getTopTracksComponent(): ScrollerItem {
         component: TopTracks,
         props: {
             tracks: store.tracks,
-            title: 'Tracks',
+            title: t('Common.Track', 2),
             route: `/artists/${store.info.artisthash}/tracks?artist=${store.info.name}`,
             playHandler: handlePlay,
             source: dropSources.artist,
@@ -209,7 +227,7 @@ const scrollerItems = computed(() => {
                     type: 'artist',
                     item: artist,
                 })),
-                title: 'Similar Artists',
+                title: t('Common.SimilarArtists'),
             },
         }
         components.push(SimilarArtistsComponent)
diff --git a/src/views/Collections/Collection.vue b/src/views/Collections/Collection.vue
index edc02f2f..476af24c 100644
--- a/src/views/Collections/Collection.vue
+++ b/src/views/Collections/Collection.vue
@@ -11,7 +11,7 @@
                     <span @click="updatePage"> {{ collection.collection?.extra.description }} </span>
                 </template>
                 <template #right>
-                    <button @click="deletePage"><DeleteSvg height="1.2rem" width="1.2rem" /> Delete</button>
+                    <button @click="deletePage"><DeleteSvg height="1.2rem" width="1.2rem" /> {{ $t('Common.Delete') }}</button>
                 </template>
             </GenericHeader>
         </template>
diff --git a/src/views/FavoriteCardScroller.vue b/src/views/FavoriteCardScroller.vue
index 9eb11da6..1f1718d6 100644
--- a/src/views/FavoriteCardScroller.vue
+++ b/src/views/FavoriteCardScroller.vue
@@ -2,13 +2,12 @@
     <CardGridPage :page="itemtype" :items="items" :fetch_callback="() => loadMore()" :more-items="waitingForMore">
         <template #header>
             <GenericHeader>
-                <template #name
-                    >Favorite <span style="text-transform: capitalize">{{ itemtype }}s</span>
+                <template #name>
+                    {{ $t("Views.FavCardScroller.Title", {item: itemtype.toUpperCase()}) }}
+                </template>
+                <template #description>
+                    {{ $t('Views.FavCardScroller.Desc', {nelem: itemtype == 'album' ? albumCount : artistCount, type: itemtype}, items.length) }}
                 </template>
-                <template #description
-                    >You have {{ itemtype == 'album' ? albumCount : artistCount }} favorited
-                    {{ itemtype + (items.length == 1 ? '' : 's') }}</template
-                >
             </GenericHeader>
         </template>
     </CardGridPage>
diff --git a/src/views/FavoriteTracks.vue b/src/views/FavoriteTracks.vue
index 3233abeb..404a96f6 100644
--- a/src/views/FavoriteTracks.vue
+++ b/src/views/FavoriteTracks.vue
@@ -1,16 +1,16 @@
 <template>
     <GenericTrackPagination
         :tracks="tracks"
-        :desc="`You have ${trackCount} favorited track${trackCount == 1 ? '' : 's'}`"
+        :desc="$t('Views.FavoriteTracks.Description', {n_tr: trackCount}, trackCount)"
         :noitemsicon="HeartSvg"
         :more-items-loader="loadMore"
         @playThis="handlePlay"
     >
         <template #header>
             <GenericHeader>
-                <template #name>Favorite Tracks</template>
+                <template #name>{{ $t('Views.FavoriteTracks.Title') }}</template>
                 <template #description
-                    >You have {{ trackCount }} favorited track{{ trackCount == 1 ? '' : 's' }}</template
+                    >{{ $t('Views.FavoriteTracks.Description', {n_tr: trackCount}, trackCount) }}</template
                 >
             </GenericHeader>
         </template>
diff --git a/src/views/Favorites.vue b/src/views/Favorites.vue
index 879ee8d2..e22ff2c8 100644
--- a/src/views/Favorites.vue
+++ b/src/views/Favorites.vue
@@ -1,23 +1,23 @@
 <template>
     <div class="content-page favorites-page">
         <GenericHeader>
-            <template #name>Favorites</template>
+            <template #name>{{ $t('Views.Favorites.Title') }}</template>
             <template #description
-                >{{ count.tracks }} Tracks • {{ count.albums }} Albums • {{ count.artists }} Artists</template
+                >{{ $t("Views.Favorites.CountStats", {tra: count.tracks, alb: count.albums, art: count.artists}) }}</template
             >
         </GenericHeader>
         <CardScroller
             v-if="recentFavs.length"
             class="recent-favs"
             :items="recentFavs"
-            :title="'Recent'"
+            :title="$t('Common.Recents')"
             :play-source="playSources.favorite"
         />
         <div v-if="favTracks.length" class="fav-tracks">
             <TopTracks
                 :tracks="favTracks"
                 :route="'/favorites/tracks'"
-                :title="'Tracks'"
+                :title="$t('Common.Track', 2)"
                 :play-handler="handlePlay"
                 :source="dropSources.favorite"
                 :total="count.tracks"
@@ -27,18 +27,18 @@
         <CardScroller
             v-if="favAlbums.length"
             :items="favAlbums.map(i => ({ type: 'album', item: i }))"
-            :title="'Albums'"
+            :title="$t('Common.Album', 2)"
             :route="'/favorites/albums'"
         />
 
         <CardScroller
             v-if="favArtists.length"
             :items="favArtists.map(i => ({ type: 'artist', item: i }))"
-            :title="'Artists'"
+            :title="$t('Common.Artist', 2)"
             :route="'/favorites/artists'"
         />
 
-        <NoItems :flag="noFavs" :icon="HeartSvg" :title="'No favorites found'" :description="description" />
+        <NoItems :flag="noFavs" :icon="HeartSvg" :title="$t('Views.Favorites.NoFavoritesFound')" :description="$t('Views.Favorites.Description')" />
     </div>
 </template>
 
@@ -58,8 +58,9 @@ import TopTracks from '@/components/ArtistView/TopTracks.vue'
 import CardScroller from '@/components/shared/CardScroller.vue'
 import GenericHeader from '@/components/shared/GenericHeader.vue'
 import NoItems from '@/components/shared/NoItems.vue'
+import { useT } from '@/i18n'
 
-const description = `You can add tracks, albums and artists to your favorites by clicking the heart icon`
+const { t } = useT()
 
 const recentFavs: Ref<RecentFavResult[]> = ref([])
 const favAlbums: Ref<Album[]> = ref([])
@@ -73,7 +74,7 @@ const count = ref({
 const noFavs = ref(false)
 
 onMounted(() => {
-    updatePageTitle('Favorites')
+    updatePageTitle(t('Views.Favorites.Title'))
     const max = maxAbumCards.value
 
     getAllFavs(6, max, max)
diff --git a/src/views/FolderView.vue b/src/views/FolderView.vue
index 16adcafa..14552500 100644
--- a/src/views/FolderView.vue
+++ b/src/views/FolderView.vue
@@ -2,12 +2,13 @@
     <div class="folder-view v-scroll-page" style="height: 100%" :class="{ isSmall, isMedium, is_alt_layout }">
         <NoItems
             :flag="folder.tracks.length === 0 && folder.dirs.length === 0"
-            :title="folder.query === '' ? 'Folder is empty' : 'No results found'"
+            :title="folder.query === '' ? 
+                $t('Views.FolderView.FolderIsEmpty') : 
+                $t('Views.FolderView.NoResultFound')"
             :description="
                 folder.query === ''
-                    ? 'The folder you are trying to access has no indexed tracks. Please add tracks to this folder and try again'
-                    : `
-      No tracks or folders in this immediate directory matched the query: '${folder.query}'`
+                    ? $t('Views.FolderView.NoIndexedTracks')
+                    : $t('Views.FolderView.NoTracksForQuery', {query: folder.query})
             "
             :icon="FolderSvg"
         />
@@ -64,7 +65,9 @@ import SongItem from '@/components/shared/SongItem.vue'
 import { xl } from '@/composables/useBreakpoints'
 import AlbumsFetcher from '@/components/ArtistView/AlbumsFetcher.vue'
 import { getFiles } from '@/requests/folders'
+import { useT } from '@/i18n'
 
+const { t } = useT()
 const queue = useQueue()
 const folder = useFolder()
 const settings = useSettings()
@@ -157,7 +160,7 @@ onBeforeRouteLeave(() => {
 })
 
 onMounted(() => {
-    updatePageTitle('Folders')
+    updatePageTitle(t('Common.Folders'))
 })
 </script>
 
diff --git a/src/views/HomeView/main.vue b/src/views/HomeView/main.vue
index 527b64a4..7c5e0eb6 100644
--- a/src/views/HomeView/main.vue
+++ b/src/views/HomeView/main.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="homepageview content-page">
         <GenericHeader>
-            <template #name>Home</template>
+            <template #name>{{ $t('HomeView.Title') }}</template>
             <template #description>{{ getGreetings(auth.user.username) }}</template>
         </GenericHeader>
         <Browse />
@@ -31,7 +31,9 @@ import updatePageTitle from '@/utils/updatePageTitle'
 import Browse from '@/components/HomeView/Browse.vue'
 import PageItem from '@/components/shared/CardScroller.vue'
 import GenericHeader from '@/components/shared/GenericHeader.vue'
+import { useT } from '@/i18n'
 
+const { t } = useT()
 const home = useHome()
 const auth = useAuth()
 
@@ -42,20 +44,20 @@ function getGreetings(username: string) {
     const hour = date.getHours()
 
     if (hour <= 3) {
-        return 'Hey there night owl'
+        return t('HomeView.Greetings.midnight')
     } else if (hour <= 5) {
-        return 'Hey there early bird'
+        return t('HomeView.Greetings.dawn')
     } else if (hour <= 12) {
-        return 'Good morning ' + username
+        return t('HomeView.Greetings.morning', { name: username })
     } else if (hour <= 17) {
-        return 'Good afternoon ' + username
+        return t('HomeView.Greetings.afternoon', { name: username })
     } else {
-        return 'Goooood evening ' + username
+        return t('HomeView.Greetings.evening', { name: username })
     }
 }
 
 onMounted(async () => {
-    updatePageTitle('Home')
+    updatePageTitle(t('HomeView.title'))
     await home.fetchAll()
     await nextTick()
     updateCardWidth()
diff --git a/src/views/LyricsView/Head.vue b/src/views/LyricsView/Head.vue
index 15c43994..e8791b5c 100644
--- a/src/views/LyricsView/Head.vue
+++ b/src/views/LyricsView/Head.vue
@@ -21,7 +21,7 @@
             <ArtistName :artists="queue.currenttrack.artists" :albumartists="queue.currenttrack.albumartists" />
         </div>
         <div class="right">
-            <div v-if="lyrics.lyrics.length && !lyrics.synced" class="lyricstype">unsynced</div>
+            <div v-if="lyrics.lyrics.length && !lyrics.synced" class="lyricstype">{{ $t('Views.LyricView.Unsynced') }}<</div>
             <div v-if="lyrics.verified" class="cloud-verified" :class="{ 'is-visible': showCheckmark }">
                 <CheckmarkSvg />
             </div>
diff --git a/src/views/LyricsView/Plugins/Find.vue b/src/views/LyricsView/Plugins/Find.vue
index 890c3b33..f43b076d 100644
--- a/src/views/LyricsView/Plugins/Find.vue
+++ b/src/views/LyricsView/Plugins/Find.vue
@@ -5,8 +5,8 @@
     @click="!plugin.error ? plugin.searchLyrics() : null"
   >
     <span v-if="plugin.error">{{ plugin.error }}</span>
-    <span v-else-if="plugin.loading"> Searching ... </span>
-    <span v-else>Search online</span>
+    <span v-else-if="plugin.loading">{{ $t('Views.LyricView.Searching') }}</span>
+    <span v-else>{{ $t('Views.LyricView.SearchOnline') }}</span>
     <span v-if="plugin.loading" class="spinner"></span>
   </button>
 </template>
diff --git a/src/views/LyricsView/main.vue b/src/views/LyricsView/main.vue
index a6942890..8b15b3eb 100644
--- a/src/views/LyricsView/main.vue
+++ b/src/views/LyricsView/main.vue
@@ -43,8 +43,8 @@
     </div>
     <div v-if="!lyrics.lyrics || lyrics.lyrics.length == 0" class="nolyrics">
         <LyricsHead />
-        <div>You don't have</div>
-        <div>the lyrics for this song</div>
+        <div>{{ $t('Views.LyricView.NoLyricsFoundFirst') }}</div>
+        <div>{{ $t('Views.LyricView.NoLyricsFoundSecond') }}</div>
         <!-- <div class="trackinfo">
           {{ queue.currenttrack.title }}
         </div> -->
diff --git a/src/views/MixListView.vue b/src/views/MixListView.vue
index 28e07904..0a98a473 100644
--- a/src/views/MixListView.vue
+++ b/src/views/MixListView.vue
@@ -3,18 +3,18 @@
         <template #header>
             <GenericHeader>
                 <template #name>
-                    <span class="headtext">{{ $route.params.type }}</span> mixes
+                    <span class="headtext">{{ $route.params.type }} </span> {{ $t('Views.MixListView.mixes') }}
                 </template>
                 <template #description>
-                    {{ items.length + savedItems.length }} mixes • Based on artists you have been listening to
+                    {{ $t('Views.MixListView.MixesBasedOnListening', {n: items.length + savedItems.length}) }}
                 </template>
 
                 <template v-if="savedItems.length" #after>
-                    <h2>Saved mixes</h2>
+                    <h2>{{ $t('Views.MixListView.SavedMixes') }}<</h2>
                     <div v-for="item in savedItemComponents" :key="item.id">
                         <component :is="item.component" :type="item.props.type" :items="item.props.items" />
                     </div>
-                    <h2 v-if="items.length" class="othertitle">Other {{ $route.params.type }} mixes</h2>
+                    <h2 v-if="items.length" class="othertitle">{{ $t('Views.MixListView.OtherMixes', {type: $route.params.type}) }}</h2>
                 </template>
             </GenericHeader>
         </template>
diff --git a/src/views/MixView.vue b/src/views/MixView.vue
index 8a5edf3c..3439a2b6 100644
--- a/src/views/MixView.vue
+++ b/src/views/MixView.vue
@@ -25,7 +25,7 @@
         </DynamicScroller>
     </div>
     <div v-if="!loading && !mix.title" class="content-page">
-        <h1>404: Mix not found</h1>
+        <h1>{{ $t('Views.MixView.MixNotFound') }}</h1>
     </div>
 </template>
 
diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue
index b7f89a7b..4cae7be0 100644
--- a/src/views/NotFound.vue
+++ b/src/views/NotFound.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="fof">
-    404! Page Not Found!
+    {{ $t('Views.NotFound.Error') }}
   </div>
 </template>
 
diff --git a/src/views/PlaylistList.vue b/src/views/PlaylistList.vue
index 7b8a4aec..f65c648e 100644
--- a/src/views/PlaylistList.vue
+++ b/src/views/PlaylistList.vue
@@ -1,9 +1,9 @@
 <template>
     <div id="p-view" class="content-page">
         <Header>
-            <template #name>Playlists</template>
+            <template #name>{{ $t('Views.PlaylistList.Title') }}</template>
             <template #description>
-                You have {{ pStore.playlists.length }} playlists in your library
+                {{ $t('Views.PlaylistList.Description', {n: pStore.playlists.length}) }}
                 <br />
                 <form spellcheck="false" @submit.prevent="() => {}">
                     <input
@@ -11,26 +11,26 @@
                         v-model="input"
                         class="rounded-sm no-border"
                         type="search"
-                        placeholder="Search playlists"
+                        :placeholder="$t('Views.PlaylistList.SearchPlaylist')"
                         name=""
                     />
                 </form>
             </template>
             <template #right>
-                <button class="playlist-button" @click="showNewPlaylistModal()"><PlusSvg /> New Playlist</button>
+                <button class="playlist-button" @click="showNewPlaylistModal()"><PlusSvg />{{ $t('NewPlaylist.Title') }}</button>
             </template>
         </Header>
-        <PlaylistCardGroup v-if="!query && pinnedPlaylists.length" :playlists="pinnedPlaylists" :title="'Pinned'" />
+        <PlaylistCardGroup v-if="!query && pinnedPlaylists.length" :playlists="pinnedPlaylists" :title="$t('Common.Pinned')" />
         <PlaylistCardGroup
             v-if="playlists.length"
             :playlists="playlists"
-            :title="query ? 'Search Results' : `${pinnedPlaylists.length ? 'Other' : 'All'} Playlists`"
+            :title="query ? $t('Common.SearchResults') : `${ pinnedPlaylists.length ? $t('Views.PlaylistList.OtherPlaylists') : $t('Views.PlaylistList.AllPlaylists') }`"
         />
         <NoItems
             :flag="!(playlists.length + pinnedPlaylists.length)"
             :icon="PlaylistSvg"
-            :title="'No playlists found'"
-            :description="description"
+            :title="$t('Views.PlaylistList.NoPlaylistsFound')"
+            :description="$t('Views.PlaylistList.NoItemDescription')"
         />
     </div>
 </template>
@@ -49,6 +49,9 @@ import PlaylistCardGroup from '@/components/PlaylistsList/PlaylistCardGroup.vue'
 import Header from '@/components/shared/GenericHeader.vue'
 import NoItems from '@/components/shared/NoItems.vue'
 import useModalStore from '@/stores/modal'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const pStore = usePStore()
 const { showNewPlaylistModal } = useModalStore()
@@ -56,9 +59,6 @@ const { showNewPlaylistModal } = useModalStore()
 const input = ref('')
 const query = debouncedRef(input, 300)
 
-const description = `You can create a playlist by right clicking on a track and selecting the
-        "Add to Playlist" option`
-
 // TODO: When you add a song to playlist when you are in this page, increase the count on the card.
 
 const pinnedPlaylists = computed(() => {
@@ -66,7 +66,7 @@ const pinnedPlaylists = computed(() => {
 })
 
 onMounted(() => {
-    updatePageTitle('Playlists')
+    updatePageTitle(t('Common.Playlists'))
 })
 
 const playlists = computed(() => {
diff --git a/src/views/PlaylistView/index.vue b/src/views/PlaylistView/index.vue
index f718625c..04ebfe91 100644
--- a/src/views/PlaylistView/index.vue
+++ b/src/views/PlaylistView/index.vue
@@ -45,6 +45,9 @@ import SongItem from '@/components/shared/SongItem.vue'
 import AfterHeader from '@/components/PlaylistView/AfterHeader.vue'
 import { onBeforeRouteLeave } from 'vue-router'
 import AlbumsFetcher from '@/components/ArtistView/AlbumsFetcher.vue'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const queue = useQueue()
 const tracklist = useTracklist()
@@ -65,8 +68,8 @@ const getNoItemsComponent = () =>
         props: {
             icon: playlistSvg,
             flag: playlist.tracks.length === 0,
-            title: 'No tracks in this playlist',
-            description: 'Add tracks to this playlist by right clicking on a track and selecting "add to playlist"',
+            title: t('Views.PlaylistView.NoTracks'),
+            description: t('Views.PlaylistView.AddMoreDesc'),
         },
     }
 
diff --git a/src/views/SearchView/CardGridPage.vue b/src/views/SearchView/CardGridPage.vue
index b628e5f3..db36cac6 100644
--- a/src/views/SearchView/CardGridPage.vue
+++ b/src/views/SearchView/CardGridPage.vue
@@ -1,8 +1,8 @@
 <template>
     <NoItems
         v-if="showNoItemsComponent"
-        :title="`No ${page} results`"
-        :description="'Results should appear here'"
+        :title="$t('Views.SearchView.NoResults', {page: page})"
+        :description="$t('Views.SearchView.NoResultsDesc')"
         :icon="SearchSvg"
         :flag="!items.length"
     />
diff --git a/src/views/SearchView/TopResults.vue b/src/views/SearchView/TopResults.vue
index 4cb0e361..ac57a86f 100644
--- a/src/views/SearchView/TopResults.vue
+++ b/src/views/SearchView/TopResults.vue
@@ -1,24 +1,24 @@
 <template>
   <div class="search-page-top-results">
     <NoItems
-      :title="'No results'"
-      :description="'We can\'t find any results for your search.'"
+      :title="$t('Common.NoResults')"
+      :description="$t('Common.NoSearchResults')"
       :icon="SearchSvg"
       :flag="!search.top_results.top_result || !search.top_results.top_result.type"
     />
     <div v-if="search.top_results.top_result && search.top_results.top_result.type" class="header">
       <div class="top">
-        <h3>Top Result</h3>
+        <h3>{{ $t('Common.TopResult') }}</h3>
         <TopItem />
       </div>
       <div class="tracks">
-        <h3>Tracks</h3>
+        <h3>{{ $t('Common.Track', 2) }}</h3>
         <TopTracks />
       </div>
     </div>
     <RecentItems
       v-if="search.top_results.artists.length"
-      :title="'Artists'"
+      :title="$t('Common.Artist', 2)"
       :items="
         search.top_results.artists.map((i) => ({
           type: 'artist',
@@ -28,7 +28,7 @@
     />
     <RecentItems
       v-if="search.top_results.albums.length"
-      :title="'Albums'"
+      :title="$t('Common.Artist', 2)"
       :items="
         search.top_results.albums.map((i) => ({
           type: 'album',
diff --git a/src/views/SearchView/main.vue b/src/views/SearchView/main.vue
index 36008280..3f7960da 100644
--- a/src/views/SearchView/main.vue
+++ b/src/views/SearchView/main.vue
@@ -32,6 +32,9 @@ import Tabs from "@/components/RightSideBar/Search/TabsWrapper.vue";
 import CardGridPage from "./CardGridPage.vue";
 import TopResults from "./TopResults.vue";
 import TracksPage from "./tracks.vue";
+import { useT } from "@/i18n";
+
+const { t } = useT(); 
 
 const settings = useSettings();
 const search = useSearchStore();
@@ -76,7 +79,7 @@ const component = computed(() => {
 });
 
 onMounted(() => {
-  updatePageTitle("Search");
+  updatePageTitle(t('Common.Search'));
   search.switchTab(route.params.page as string);
   search.query = route.query.q as string;
 });
diff --git a/src/views/SearchView/tracks.vue b/src/views/SearchView/tracks.vue
index 55501a86..8aa6dbc2 100644
--- a/src/views/SearchView/tracks.vue
+++ b/src/views/SearchView/tracks.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="search-tracks-view">
         <NoItems
-            :title="'No track results'"
+            :title="$t('Common.NoTrackResults')"
             :description="desc"
             :icon="SearchSvg"
             :flag="!search.tracks.value.length"
@@ -35,13 +35,16 @@ import SearchSvg from '@/assets/icons/search.svg'
 import AlbumsFetcher from '@/components/ArtistView/AlbumsFetcher.vue'
 import NoItems from '@/components/shared/NoItems.vue'
 import SongItem from '@/components/shared/SongItem.vue'
+import { useT } from '@/i18n'
+
+const { t } = useT()
 
 const queue = useQueue()
 const search = useSearch()
 const tracklist = useTracklist()
 
 const desc = computed(() =>
-    search.query === '' ? 'Start typing to search for tracks' : `Track results for '${search.query}' should appear here`
+    search.query === '' ? t('Views.SearchView.TypeToSearchTracks') : t('Views.SearchView.ResultsForQuery', {query: search.query})
 )
 
 interface scrollerItem {
diff --git a/src/views/SettingsView.vue b/src/views/SettingsView.vue
index 418e3454..9f9f7351 100644
--- a/src/views/SettingsView.vue
+++ b/src/views/SettingsView.vue
@@ -15,11 +15,14 @@ import { getAllSettings } from "@/requests/settings";
 import updatePageTitle from "@/utils/updatePageTitle";
 
 import Content from "../components/SettingsView/Content.vue";
+import { useT } from "@/i18n";
+
+const { t } = useT();
 
 const store = useSettingsStore();
 
 onMounted(() => {
-  updatePageTitle("Settings");
+  updatePageTitle(t('Common.Settings'));
   getAllSettings().then(({ settings }) => {
     store.mapDbSettings(settings);
   });
diff --git a/src/views/Stats/main.vue b/src/views/Stats/main.vue
index 9fdbdf93..fc53c034 100644
--- a/src/views/Stats/main.vue
+++ b/src/views/Stats/main.vue
@@ -3,8 +3,8 @@
         <Charts />
         <br><br>
         <GenericHeader>
-            <template #name>Stats</template>
-            <template #description>Your listening stats for the past week</template>
+            <template #name>{{ $t('Views.Stats.Title')}}</template>
+            <template #description>{{$t('Views.Stats.Description')}}</template>
         </GenericHeader>
         <Stats />
     </div>
diff --git a/src/vue-i18n.d.ts b/src/vue-i18n.d.ts
new file mode 100644
index 00000000..eb6c7272
--- /dev/null
+++ b/src/vue-i18n.d.ts
@@ -0,0 +1,9 @@
+//Credits: https://stackoverflow.com/a/79465187
+
+import { Composer } from 'vue-i18n'
+
+declare module '@vue/runtime-core' {
+  interface ComponentCustomProperties {
+    $t: Composer['t']
+  }
+}
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index d0e35fce..c7e84494 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1163,6 +1163,36 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
   integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
 
+"@intlify/core-base@11.4.5":
+  version "11.4.5"
+  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-11.4.5.tgz#63cc25be7fe6b6d945a61f343aa82bb95050fcb3"
+  integrity sha512-lja3F/iKVIvTa48mIwmrIeDcQUFZ0F0drvFvT8AwINOvbwnAzl/S/p8p2DxILZpWEUHRi1qewfWNIkMvhD3kKA==
+  dependencies:
+    "@intlify/devtools-types" "11.4.5"
+    "@intlify/message-compiler" "11.4.5"
+    "@intlify/shared" "11.4.5"
+
+"@intlify/devtools-types@11.4.5":
+  version "11.4.5"
+  resolved "https://registry.yarnpkg.com/@intlify/devtools-types/-/devtools-types-11.4.5.tgz#ea9b7bf1626ea547bceb55cfd0af8391e05cd990"
+  integrity sha512-W5vydP9Yq3t82IyWqCM6aR0BTWCZrN5RAwjZEPpH8I2OQWp2RLy03Evh2ANZlSMhcvGAoyDg25k0so85Kwncpw==
+  dependencies:
+    "@intlify/core-base" "11.4.5"
+    "@intlify/shared" "11.4.5"
+
+"@intlify/message-compiler@11.4.5":
+  version "11.4.5"
+  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-11.4.5.tgz#da059bb41cee170245d15fcdcade7c1e031169e5"
+  integrity sha512-IEOZiHtbQopyPc/Dz2M869lOlZYX1SdcniNJwphATDYHhovvIneEKf1EFF37DE7NAABZtza1FNtnwwqZWInfpw==
+  dependencies:
+    "@intlify/shared" "11.4.5"
+    source-map-js "^1.0.2"
+
+"@intlify/shared@11.4.5":
+  version "11.4.5"
+  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-11.4.5.tgz#18d842c41b43fef73f3327e7cbbec92751a16a4b"
+  integrity sha512-g/i5mtdUa9ia/8BaJ4w6ZRHgAXYQd9XyCaQPRMvsd8d5qmZwkjoTmHrNsI28Q/7I8h+2ijUkI4uEnnMCziKupQ==
+
 "@jimp/bmp@^0.16.13":
   version "0.16.13"
   resolved "https://registry.yarnpkg.com/@jimp/bmp/-/bmp-0.16.13.tgz#57ffa5b17417b5a181f6f184bdabc8218e8448ef"
@@ -1761,6 +1791,11 @@
   resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.4.5.tgz#d54e844c1adbb1e677c81c665ecef1a2b4bb8380"
   integrity sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ==
 
+"@vue/devtools-api@^6.5.0":
+  version "6.6.4"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz#cbe97fe0162b365edc1dba80e173f90492535343"
+  integrity sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==
+
 "@vue/reactivity-transform@3.3.4":
   version "3.3.4"
   resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.3.4.tgz#52908476e34d6a65c6c21cd2722d41ed8ae51929"
@@ -2473,6 +2508,11 @@ convert-source-map@^1.7.0:
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.9.0.tgz#7faae62353fb4213366d0ca98358d22e8368b05f"
   integrity sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==
 
+cookie@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/cookie/-/cookie-1.0.2.tgz#27360701532116bd3f1f9416929d176afe1e4610"
+  integrity sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==
+
 core-js-compat@^3.30.1, core-js-compat@^3.30.2:
   version "3.31.0"
   resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.31.0.tgz#4030847c0766cc0e803dcdfb30055d7ef2064bf1"
@@ -5818,6 +5858,13 @@ unique-string@^2.0.0:
   dependencies:
     crypto-random-string "^2.0.0"
 
+universal-cookie@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/universal-cookie/-/universal-cookie-8.0.1.tgz#19263fcda6889978a081c610a90fc395eeaeec64"
+  integrity sha512-B6ks9FLLnP1UbPPcveOidfvB9pHjP+wekP2uRYB9YDfKVpvcjKgy1W5Zj+cEXJ9KTPnqOKGfVDQBmn8/YCQfRg==
+  dependencies:
+    cookie "^1.0.2"
+
 universalify@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
@@ -6003,6 +6050,16 @@ vue-eslint-parser@^9.3.1:
     lodash "^4.17.21"
     semver "^7.3.6"
 
+vue-i18n@^11.4:
+  version "11.4.5"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-11.4.5.tgz#41dac75b7c25dff6a819b7f7835cac99e32ec41e"
+  integrity sha512-rm8YJ6RpjOrkcgS2GLrZwLvs/VbhxbTSuEspbyXDo233+fPK0OMFNLOj3fdQYVKdOgcpSfLW91JhbqgpkkcBWA==
+  dependencies:
+    "@intlify/core-base" "11.4.5"
+    "@intlify/devtools-types" "11.4.5"
+    "@intlify/shared" "11.4.5"
+    "@vue/devtools-api" "^6.5.0"
+
 vue-observe-visibility@^2.0.0-alpha.1:
   version "2.0.0-alpha.1"
   resolved "https://registry.yarnpkg.com/vue-observe-visibility/-/vue-observe-visibility-2.0.0-alpha.1.tgz#1e4eda7b12562161d58984b7e0dea676d83bdb13"