diff --git a/frontend/src/components/Details/Info/GameInfo.vue b/frontend/src/components/Details/Info/GameInfo.vue
index 37b4323c3..2c3d23a62 100644
--- a/frontend/src/components/Details/Info/GameInfo.vue
+++ b/frontend/src/components/Details/Info/GameInfo.vue
@@ -211,7 +211,7 @@ function onFilterClick(filter: FilterType, value: string) {
               <template #prev="{ props }">
                 <v-btn
                   icon="mdi-chevron-left"
-                  class="translucent-dark"
+                  class="translucent"
                   @click="props.onClick"
                 />
               </template>
@@ -242,7 +242,7 @@ function onFilterClick(filter: FilterType, value: string) {
               <template #next="{ props }">
                 <v-btn
                   icon="mdi-chevron-right"
-                  class="translucent-dark"
+                  class="translucent"
                   @click="props.onClick"
                 />
               </template>
@@ -261,7 +261,7 @@ function onFilterClick(filter: FilterType, value: string) {
                     <v-btn
                       @click="props.onClick"
                       icon="mdi-chevron-left"
-                      class="translucent-dark"
+                      class="translucent"
                     />
                   </template>
                   <v-carousel-item
@@ -288,7 +288,7 @@ function onFilterClick(filter: FilterType, value: string) {
                   <template #next="{ props }">
                     <v-btn
                       icon="mdi-chevron-right"
-                      class="translucent-dark"
+                      class="translucent"
                       @click="props.onClick"
                     />
                   </template>
diff --git a/frontend/src/components/Gallery/AppBar/Collection/CollectionInfoDrawer.vue b/frontend/src/components/Gallery/AppBar/Collection/CollectionInfoDrawer.vue
index 60ae54691..c93729f9d 100644
--- a/frontend/src/components/Gallery/AppBar/Collection/CollectionInfoDrawer.vue
+++ b/frontend/src/components/Gallery/AppBar/Collection/CollectionInfoDrawer.vue
@@ -195,7 +195,7 @@ async function updateCollection() {
                     !heartbeat.value.METADATA_SOURCES?.STEAMGRIDDB_API_ENABLED
                   "
                   size="small"
-                  class="translucent-dark"
+                  class="translucent"
                   @click="
                     emitter?.emit('showSearchCoverDialog', {
                       term: currentCollection.name as string,
@@ -208,7 +208,7 @@ async function updateCollection() {
                 <v-btn
                   title="Upload custom cover"
                   size="small"
-                  class="translucent-dark"
+                  class="translucent"
                   @click="triggerFileInput"
                 >
                   <v-icon size="large">mdi-cloud-upload-outline</v-icon>
@@ -224,7 +224,7 @@ async function updateCollection() {
                 <v-btn
                   title="Remove cover"
                   size="small"
-                  class="translucent-dark"
+                  class="translucent"
                   @click="removeArtwork"
                 >
                   <v-icon size="large" class="text-romm-red">mdi-delete</v-icon>
diff --git a/frontend/src/components/common/Collection/Dialog/CreateCollection.vue b/frontend/src/components/common/Collection/Dialog/CreateCollection.vue
index 90e6d4133..40d6a84fc 100644
--- a/frontend/src/components/common/Collection/Dialog/CreateCollection.vue
+++ b/frontend/src/components/common/Collection/Dialog/CreateCollection.vue
@@ -176,7 +176,7 @@ function closeDialog() {
                           ?.STEAMGRIDDB_API_ENABLED
                       "
                       size="small"
-                      class="translucent-dark"
+                      class="translucent"
                       @click="
                         emitter?.emit('showSearchCoverDialog', {
                           term: collection.name as string,
@@ -188,7 +188,7 @@ function closeDialog() {
                     </v-btn>
                     <v-btn
                       size="small"
-                      class="translucent-dark"
+                      class="translucent"
                       @click="triggerFileInput"
                     >
                       <v-icon size="large">mdi-pencil</v-icon>
@@ -203,7 +203,7 @@ function closeDialog() {
                     </v-btn>
                     <v-btn
                       size="small"
-                      class="translucent-dark"
+                      class="translucent"
                       @click="removeArtwork"
                     >
                       <v-icon size="large" class="text-romm-red"
diff --git a/frontend/src/components/common/Game/Card/Base.vue b/frontend/src/components/common/Game/Card/Base.vue
index 1f9168a5f..21f6a95e3 100644
--- a/frontend/src/components/common/Game/Card/Base.vue
+++ b/frontend/src/components/common/Game/Card/Base.vue
@@ -232,7 +232,7 @@ onBeforeUnmount(() => {
                         !rom.ss_url_cover &&
                         !rom.sgdb_url_cover)
                     "
-                    class="translucent-dark text-white"
+                    class="translucent text-white"
                     :class="
                       sizeActionBar === 1 ? 'text-subtitle-1' : 'text-caption'
                     "
@@ -287,7 +287,7 @@ onBeforeUnmount(() => {
                     />
                     <v-chip
                       v-if="rom.hasheous_id"
-                      class="translucent-dark text-white mr-1 mb-1 px-1"
+                      class="translucent text-white mr-1 mb-1 px-1"
                       density="compact"
                       title="Verified with Hasheous"
                     >
@@ -295,7 +295,7 @@ onBeforeUnmount(() => {
                     </v-chip>
                     <v-chip
                       v-if="rom.siblings.length > 0 && showSiblings"
-                      class="translucent-dark text-white mr-1 mb-1 px-1"
+                      class="translucent text-white mr-1 mb-1 px-1"
                       density="compact"
                       :title="`${rom.siblings.length} sibling(s)`"
                     >
@@ -306,13 +306,13 @@ onBeforeUnmount(() => {
                       text="Favorite"
                       color="secondary"
                       density="compact"
-                      class="translucent-dark text-white mr-1 mb-1 px-1"
+                      class="translucent text-white mr-1 mb-1 px-1"
                     >
                       <v-icon>mdi-star</v-icon>
                     </v-chip>
                     <v-chip
                       v-if="hasNotes && showChips"
-                      class="translucent-dark text-white mr-1 mb-1 px-1"
+                      class="translucent text-white mr-1 mb-1 px-1"
                       density="compact"
                       title="View notes"
                       @click.stop="showNoteDialog"
@@ -333,7 +333,7 @@ onBeforeUnmount(() => {
                       (isOuterHovering || activeMenu) &&
                       !smAndDown
                     "
-                    class="translucent-dark"
+                    class="translucent"
                     @menu-open="handleOpenMenu"
                     @menu-close="handleCloseMenu"
                     :rom="rom"
diff --git a/frontend/src/components/common/Game/Card/Flags.vue b/frontend/src/components/common/Game/Card/Flags.vue
index 398df161e..0f7d71a67 100644
--- a/frontend/src/components/common/Game/Card/Flags.vue
+++ b/frontend/src/components/common/Game/Card/Flags.vue
@@ -32,7 +32,7 @@ const playingStatus = computed(() => {
   <v-chip
     v-if="rom.regions.filter(identity).length > 0 && showRegions"
     :title="`Regions: ${rom.regions.join(', ')}`"
-    class="translucent-dark mr-1 mt-1 px-1"
+    class="translucent mr-1 mt-1 px-1"
     :class="{ 'emoji-collection': rom.regions.length > 3 }"
     density="compact"
   >
@@ -43,7 +43,7 @@ const playingStatus = computed(() => {
   <v-chip
     v-if="rom.languages.filter(identity).length > 0 && showLanguages"
     :title="`Languages: ${rom.languages.join(', ')}`"
-    class="translucent-dark mr-1 mt-1 px-1"
+    class="translucent mr-1 mt-1 px-1"
     :class="{ 'emoji-collection': rom.languages.length > 3 }"
     density="compact"
   >
@@ -53,7 +53,7 @@ const playingStatus = computed(() => {
   </v-chip>
   <v-chip
     v-if="playingStatus && showStatus"
-    class="translucent-dark mr-1 mt-1 px-2"
+    class="translucent mr-1 mt-1 px-2"
     density="compact"
     :title="getTextForStatus(playingStatus)"
   >
diff --git a/frontend/src/components/common/Game/Card/Related.vue b/frontend/src/components/common/Game/Card/Related.vue
index 0be83128c..eb1b23aca 100644
--- a/frontend/src/components/common/Game/Card/Related.vue
+++ b/frontend/src/components/common/Game/Card/Related.vue
@@ -31,7 +31,7 @@ const missingCoverImage = computed(() => getMissingCoverImage(props.game.name));
         lazy
       >
         <v-chip
-          class="px-2 position-absolute chip-type text-white translucent-dark"
+          class="px-2 position-absolute chip-type text-white translucent"
           density="compact"
           label
         >
diff --git a/frontend/src/components/common/Game/Dialog/EditRom.vue b/frontend/src/components/common/Game/Dialog/EditRom.vue
index a47637453..33ed3ef32 100644
--- a/frontend/src/components/common/Game/Dialog/EditRom.vue
+++ b/frontend/src/components/common/Game/Dialog/EditRom.vue
@@ -223,7 +223,7 @@ function closeDialog() {
                       !heartbeat.value.METADATA_SOURCES?.STEAMGRIDDB_API_ENABLED
                     "
                     size="small"
-                    class="translucent-dark"
+                    class="translucent"
                     @click="
                       emitter?.emit('showSearchCoverDialog', {
                         term: rom.name as string,
@@ -235,7 +235,7 @@ function closeDialog() {
                   </v-btn>
                   <v-btn
                     size="small"
-                    class="translucent-dark"
+                    class="translucent"
                     @click="triggerFileInput('cover-file-input')"
                   >
                     <v-icon size="large">mdi-pencil</v-icon>
@@ -250,7 +250,7 @@ function closeDialog() {
                   </v-btn>
                   <v-btn
                     size="small"
-                    class="translucent-dark"
+                    class="translucent"
                     @click="removeArtwork"
                   >
                     <v-icon size="large" class="text-romm-red"
diff --git a/frontend/src/components/common/Game/Table.vue b/frontend/src/components/common/Game/Table.vue
index ae1e7355f..bcf7bded2 100644
--- a/frontend/src/components/common/Game/Table.vue
+++ b/frontend/src/components/common/Game/Table.vue
@@ -216,7 +216,7 @@ function updateOptions({ sortBy }: { sortBy: SortBy }) {
           />
           <v-chip
             v-if="item.hasheous_id"
-            class="translucent-dark text-white mr-1 mb-1 px-1"
+            class="translucent text-white mr-1 mb-1 px-1"
             density="compact"
             title="Verified with Hasheous"
           >
@@ -224,7 +224,7 @@ function updateOptions({ sortBy }: { sortBy: SortBy }) {
           </v-chip>
           <v-chip
             v-if="item.siblings.length > 0 && showSiblings"
-            class="translucent-dark text-white mr-1 mb-1 px-1"
+            class="translucent text-white mr-1 mb-1 px-1"
             density="compact"
             :title="`${item.siblings.length} sibling(s)`"
           >
diff --git a/frontend/src/components/common/MissingFromFSIcon.vue b/frontend/src/components/common/MissingFromFSIcon.vue
index be1ac46f2..b15b61884 100644
--- a/frontend/src/components/common/MissingFromFSIcon.vue
+++ b/frontend/src/components/common/MissingFromFSIcon.vue
@@ -21,7 +21,7 @@ withDefaults(
 <template>
   <v-chip
     v-if="chip"
-    class="translucent-dark"
+    class="translucent"
     :density="chipDensity"
     color="accent"
     :label="chipLabel"
diff --git a/frontend/src/styles/common.css b/frontend/src/styles/common.css
index cc1693019..19f1f33fe 100644
--- a/frontend/src/styles/common.css
+++ b/frontend/src/styles/common.css
@@ -12,14 +12,7 @@ body {
     0 0 3px #000000 !important;
 }
 .translucent {
-  backdrop-filter: blur(3px) !important;
-  text-shadow:
-    1px 1px 1px #000000,
-    0 0 1px #000000 !important;
-}
-.translucent-dark {
   background: rgba(0, 0, 0, 0.35) !important;
-  backdrop-filter: blur(10px) !important;
   text-shadow:
     1px 1px 1px #000000,
     0 0 1px #000000 !important;
diff --git a/frontend/src/views/Auth/Login.vue b/frontend/src/views/Auth/Login.vue
index cdcec2e4d..dae1b95f2 100644
--- a/frontend/src/views/Auth/Login.vue
+++ b/frontend/src/views/Auth/Login.vue
@@ -96,7 +96,7 @@ async function loginOIDC() {
 </script>
 
 <template>
-  <v-card class="translucent-dark py-8 px-5" width="500">
+  <v-card class="translucent py-8 px-5" width="500">
     <v-img src="/assets/isotipo.svg" class="mx-auto mb-8" width="80" />
     <v-expand-transition>
       <v-row
diff --git a/frontend/src/views/Auth/Register.vue b/frontend/src/views/Auth/Register.vue
index 253faa805..4c79c81d5 100644
--- a/frontend/src/views/Auth/Register.vue
+++ b/frontend/src/views/Auth/Register.vue
@@ -48,7 +48,7 @@ onBeforeMount(() => {
 </script>
 
 <template>
-  <v-card class="translucent-dark py-8 px-5" width="500">
+  <v-card class="translucent py-8 px-5" width="500">
     <v-img src="/assets/isotipo.svg" class="mx-auto mb-8" width="80" />
     <v-row class="text-white justify-center mt-2" no-gutters>
       <v-col cols="10">
diff --git a/frontend/src/views/Auth/ResetPassword.vue b/frontend/src/views/Auth/ResetPassword.vue
index bddd9d489..e73ccf8eb 100644
--- a/frontend/src/views/Auth/ResetPassword.vue
+++ b/frontend/src/views/Auth/ResetPassword.vue
@@ -53,7 +53,7 @@ async function resetPassword() {
 </script>
 
 <template>
-  <v-card class="translucent-dark py-8 px-5" width="500">
+  <v-card class="translucent py-8 px-5" width="500">
     <v-img src="/assets/isotipo.svg" class="mx-auto mb-8" width="80" />
     <v-row class="text-white justify-center mt-2" no-gutters>
       <v-col cols="10">
diff --git a/frontend/src/views/Auth/Setup.vue b/frontend/src/views/Auth/Setup.vue
index 88a599477..db417ddfc 100644
--- a/frontend/src/views/Auth/Setup.vue
+++ b/frontend/src/views/Auth/Setup.vue
@@ -93,7 +93,7 @@ async function finishWizard() {
 </script>
 
 <template>
-  <v-card class="translucent-dark px-3" width="700">
+  <v-card class="translucent px-3" width="700">
     <v-img src="/assets/isotipo.svg" class="mx-auto mt-6" width="70" />
     <v-stepper :mobile="xs" class="bg-transparent" v-model="step" flat>
       <template #default="{ prev, next }">