diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
index 52805b750..d5decd415 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
@@ -71,7 +71,7 @@
       <ng-container *ngIf="!connected || loadingTip || (block && block.loading)">
         <div class="flashing loading">
           <div class="text-center bitcoin-block mined-block" id="bitcoin-block-{{ block.height }}"
-            [ngStyle]="emptyBlockStyles[i]"></div>
+            [ngStyle]="convertStyleForLoadingBlock(blockStyles[i])"></div>
         </div>
       </ng-container>
     </ng-template>
diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
index 39f68c22e..3feaf6c2d 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
@@ -290,6 +290,13 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
     };
   }
 
+  convertStyleForLoadingBlock(style) {
+    return {
+      ...style,
+      background: "#2d3348",
+    };
+  }
+
   getStyleForLoadingBlock(index: number, animateEnterFrom: number = 0) {
     const addLeft = animateEnterFrom || 0;