diff --git a/apps/block_scout_web/assets/css/components/_card.scss b/apps/block_scout_web/assets/css/components/_card.scss
index 37cbaf973d..8fff120deb 100644
--- a/apps/block_scout_web/assets/css/components/_card.scss
+++ b/apps/block_scout_web/assets/css/components/_card.scss
@@ -155,8 +155,8 @@ $card-tab-icon-color-active: #fff !default;
 }
 
 .card-chain-blocks {
-  height: 233px;
-
+  min-height: 233px;
+  max-height: auto;
   [class*="col-"]:last-child {
     .tile {
       margin-bottom: 0;
@@ -165,7 +165,8 @@ $card-tab-icon-color-active: #fff !default;
 }
 
 .card-chain-transactions {
-  height: 664px;
+  min-height: 664px;
+  max-height: auto;
 
   .tile {
     margin-bottom: 0;
diff --git a/apps/block_scout_web/assets/css/components/_tile.scss b/apps/block_scout_web/assets/css/components/_tile.scss
index e621e4fd6d..79441d0722 100644
--- a/apps/block_scout_web/assets/css/components/_tile.scss
+++ b/apps/block_scout_web/assets/css/components/_tile.scss
@@ -562,3 +562,15 @@ $cube-quantity: 5;
     transform: scale(0);
   }
 }
+
+.dark-block-loader {
+  width: auto;
+  height: 15px;
+  background-color: #e2e5ec;
+  margin-bottom: 5px;
+  border-radius: 4px;
+}
+
+.dark-theme-applied .dark-block-loader {
+  background-color: #313355;
+}
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex
index 8285d429e0..cb42c2c338 100644
--- a/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex
+++ b/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex
@@ -91,13 +91,50 @@
             <%= gettext "Something went wrong, click to reload." %>
           </span>
         </button>
-        <div hidden data-selector="loading-message" class="tile tile-muted text-center mt-3 w-100" >
-          <span  class="loading-spinner-small mr-2">
-            <span class="loading-spinner-block-1"></span>
-            <span class="loading-spinner-block-2"></span>
-          </span>
-          <%= gettext("Loading...") %>
+         <div hidden data-selector="loading-message" class="col-lg-3" >
+         <div data-selector="chain-block">
+         <div class="tile tile-type-block n-p d-flex flex-column">
+         <a class="tile-title"><span class="tile-loader tile-label-loader"></span> </a>
+         <div class="tile-bottom-contents">
+         <div class="dark-block-loader"></div>
+         <div class="dark-block-loader"></div>
+         </div>
+        </div>
+        </div>
+        </div>
+         <div hidden data-selector="loading-message" class="col-lg-3" >
+         <div data-selector="chain-block">
+         <div class="tile tile-type-block n-p d-flex flex-column">
+         <a class="tile-title"><span class="tile-loader tile-label-loader"></span> </a> 
+         <div class="tile-bottom-contents">
+         <div class="dark-block-loader"></div>
+         <div class="dark-block-loader"></div>
+         </div>
+        </div>
+        </div>
+        </div>
+         <div hidden data-selector="loading-message" class="col-lg-3" >
+         <div data-selector="chain-block">
+         <div class="tile tile-type-block n-p d-flex flex-column">
+         <a class="tile-title"><span class="tile-loader tile-label-loader"></span> </a> 
+         <div class="tile-bottom-contents">
+         <div class="dark-block-loader"></div>
+         <div class="dark-block-loader"></div>
+         </div>
+        </div>
+        </div>
+        </div>
+         <div hidden data-selector="loading-message" class="col-lg-3" >
+         <div data-selector="chain-block">
+         <div class="tile tile-type-block n-p d-flex flex-column">
+         <a class="tile-title"><span class="tile-loader tile-label-loader"></span> </a>
+         <div class="tile-bottom-contents">
+        <div class="dark-block-loader"></div>
+         <div class="dark-block-loader"></div>
+         </div>
+        </div>
         </div>
+        </div>   
       </div>
     </div>
   </div>
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/common_components/_tile-loader.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/common_components/_tile-loader.html.eex
index 6607baaeae..91195d51db 100644
--- a/apps/block_scout_web/lib/block_scout_web/templates/common_components/_tile-loader.html.eex
+++ b/apps/block_scout_web/lib/block_scout_web/templates/common_components/_tile-loader.html.eex
@@ -46,6 +46,54 @@
     </div>
   </div>
 </div>
+<div data-loading-message data-selector="loading-message" class="tile tile-type-loading">
+  <div class="row tile-body">
+    <div class="tile-transaction-type-block col-md-2 d-flex flex-row flex-md-column">
+      <span class="tile-label">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+      <span class="tile-status-label ml-2 ml-md-0">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+    </div>
+    <div class="col-md-7 col-lg-8 d-flex flex-column pr-2 pr-sm-2 pr-md-0">
+      <span class="tile-loader tile-address-loader"></span>
+      <span class="tile-loader tile-address-loader"></span>
+    </div>
+    <div class="col-md-3 col-lg-2 d-flex flex-row flex-md-column flex-nowrap justify-content-center text-md-right mt-3 mt-md-0 tile-bottom">
+      <span class="mr-2 mr-md-0 order-1">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+      <span class="mr-2 mr-md-0 order-2">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+    </div>
+  </div>
+</div>
+<div data-loading-message data-selector="loading-message" class="tile tile-type-loading">
+  <div class="row tile-body">
+    <div class="tile-transaction-type-block col-md-2 d-flex flex-row flex-md-column">
+      <span class="tile-label">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+      <span class="tile-status-label ml-2 ml-md-0">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+    </div>
+    <div class="col-md-7 col-lg-8 d-flex flex-column pr-2 pr-sm-2 pr-md-0">
+      <span class="tile-loader tile-address-loader"></span>
+      <span class="tile-loader tile-address-loader"></span>
+    </div>
+    <div class="col-md-3 col-lg-2 d-flex flex-row flex-md-column flex-nowrap justify-content-center text-md-right mt-3 mt-md-0 tile-bottom">
+      <span class="mr-2 mr-md-0 order-1">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+      <span class="mr-2 mr-md-0 order-2">
+        <span class="tile-loader tile-label-loader"></span>
+      </span>
+    </div>
+  </div>
+</div>
 <div data-loading-message data-selector="loading-message" class="tile tile-type-loading">
   <div class="row tile-body">
     <div class="tile-transaction-type-block col-md-2 d-flex flex-row flex-md-column">