diff --git a/src/components/surround.ts b/src/components/surround.ts
index cdd95ce1..7d1c246c 100644
--- a/src/components/surround.ts
+++ b/src/components/surround.ts
@@ -178,6 +178,7 @@ export class FrigateCardSurround extends LitElement {
             .hass=${this.hass}
             .config=${this.thumbnailConfig}
             .cameraManager=${this.cameraManager}
+            .fadeThumbnails=${this.view.isViewerView()}
             .view=${this.view}
             .selected=${this.view.queryResults?.getSelectedIndex() ?? undefined}
             @frigate-card:view:change=${(ev: CustomEvent) => changeDrawer(ev, 'close')}
diff --git a/src/components/thumbnail-carousel.ts b/src/components/thumbnail-carousel.ts
index 1248efe0..425d077b 100644
--- a/src/components/thumbnail-carousel.ts
+++ b/src/components/thumbnail-carousel.ts
@@ -37,6 +37,9 @@ export class FrigateCardThumbnailCarousel extends LitElement {
   @property({ attribute: false })
   public config?: ThumbnailsControlConfig;
 
+  @property({ attribute: false })
+  public fadeThumbnails = false;
+
   protected _thumbnailSlides: TemplateResult[] = [];
 
   protected willUpdate(changedProps: PropertyValues): void {
@@ -65,7 +68,7 @@ export class FrigateCardThumbnailCarousel extends LitElement {
     if (changedProps.has('view')) {
       this.style.setProperty(
         '--frigate-card-carousel-thumbnail-opacity',
-        this._getSelectedSlide() === null ? '1.0' : '0.4',
+        !this.fadeThumbnails || this._getSelectedSlide() === null ? '1.0' : '0.4',
       );
     }
   }