diff --git a/assets/app.css b/assets/app.css
index 98a26d1a..28b11a00 100644
--- a/assets/app.css
+++ b/assets/app.css
@@ -57,12 +57,23 @@ body {
   background-image: url(/wood_panels.jpg);
 }
 
+.altBookshelfRow {
+  background-image: url(/grey_panel.jpg);
+  background-size: cover;
+}
+
 .bookshelfDivider {
   background: rgb(149, 119, 90);
   background: linear-gradient(180deg, rgba(149, 119, 90, 1) 0%, rgba(103, 70, 37, 1) 17%, rgba(103, 70, 37, 1) 88%, rgba(71, 48, 25, 1) 100%);
   box-shadow: 2px 10px 8px #1111117e;
 }
 
+.altBookshelfDivider {
+  background: rgb(38 38 38);
+  /*background: linear-gradient(180deg, rgba(191, 193, 195, 1) 0%, rgb(156, 158, 159) 17%, rgb(114, 115, 117) 88%, rgb(120, 120, 122) 100%);*/
+  box-shadow: 2px 10px 8px #1111117e;
+}
+
 /*
 Bookshelf Label
 */
@@ -78,6 +89,14 @@ Bookshelf Label
   color: #fce3a6;
 }
 
+.altBookshelfLabel {
+  background-color: #2d3436;
+  background-image: linear-gradient(315deg, #19191a 0%, rgb(15, 15, 15) 74%);
+  border-color: rgb(255, 255, 255);
+  border-style: solid;
+  color: #ffffff;
+}
+
 .cover-bg {
   width: calc(100% + 40px);
   height: calc(100% + 40px);
diff --git a/components/bookshelf/LazyBookshelf.vue b/components/bookshelf/LazyBookshelf.vue
index a97f5e6a..0eb176d5 100644
--- a/components/bookshelf/LazyBookshelf.vue
+++ b/components/bookshelf/LazyBookshelf.vue
@@ -1,8 +1,8 @@
 <template>
   <div id="bookshelf" class="w-full max-w-full h-full">
     <template v-for="shelf in totalShelves">
-      <div :key="shelf" class="w-full px-2 relative" :class="showBookshelfListView ? '' : 'bookshelfRow'" :id="`shelf-${shelf - 1}`" :style="{ height: shelfHeight + 'px' }">
-        <div v-if="!showBookshelfListView" class="bookshelfDivider w-full absolute bottom-0 left-0 z-30" style="min-height: 16px" :class="`h-${shelfDividerHeightIndex}`" />
+      <div :key="shelf" class="w-full px-2 relative" :class="showBookshelfListView ? '' : bookshelfRowStyle" :id="`shelf-${shelf - 1}`" :style="{ height: shelfHeight + 'px' }">
+        <div v-if="!showBookshelfListView" class="w-full absolute bottom-0 left-0 z-30" style="min-height: 16px" :class="[(shelfDividerStyle), (`h-${shelfDividerHeightIndex}`)]" />
         <div v-else class="flex border-t border-white border-opacity-10" />
       </div>
     </template>
@@ -69,6 +69,14 @@ export default {
     showBookshelfListView() {
       return this.isBookEntity && this.bookshelfListView
     },
+    bookshelfRowStyle() {
+      if (this.altViewEnabled) return 'altBookshelfRow'
+      return 'bookshelfRow'
+    },
+    bookshelfDividerStyle() {
+      if (this.altViewEnabled) return 'altBookshelfDivider'
+      return 'bookshelfDivider'
+    },
     entityName() {
       return this.page
     },
@@ -125,6 +133,9 @@ export default {
       if (this.showBookshelfListView) return this.entityWidth
       // Includes margin
       return this.entityWidth + 24
+    },
+    altViewEnabled() {
+      return this.$store.getters['getAltViewEnabled'];
     }
   },
   methods: {