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 04575121b..d4c427cce 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
@@ -169,7 +169,7 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
   }
 
   getStyleForBlock(block: Block) {
-    const greenBackgroundHeight = 100 - (block.weight / 4000000) * 100;
+    const greenBackgroundHeight = 100 - (block.weight / this.stateService.env.BLOCK_WEIGHT_UNITS) * 100;
     let addLeft = 0;
 
     if (block.stage === 1) {
diff --git a/frontend/src/app/components/latest-blocks/latest-blocks.component.html b/frontend/src/app/components/latest-blocks/latest-blocks.component.html
index 2bae5efaf..fa0bd72b8 100644
--- a/frontend/src/app/components/latest-blocks/latest-blocks.component.html
+++ b/frontend/src/app/components/latest-blocks/latest-blocks.component.html
@@ -20,7 +20,7 @@
         <td class="d-none d-lg-block">{{ block.tx_count | number }}</td>
         <td>
           <div class="progress">
-            <div class="progress-bar progress-mempool {{ network$ | async }}" role="progressbar" [ngStyle]="{'width': (block.weight / 4000000)*100 + '%' }"></div>
+            <div class="progress-bar progress-mempool {{ network$ | async }}" role="progressbar" [ngStyle]="{'width': (block.weight / stateService.env.BLOCK_WEIGHT_UNITS)*100 + '%' }"></div>
             <div class="progress-text" [innerHTML]="block.size | bytes: 2"></div>
           </div>
         </td>
diff --git a/frontend/src/app/components/latest-blocks/latest-blocks.component.ts b/frontend/src/app/components/latest-blocks/latest-blocks.component.ts
index 15b2843bd..cef512388 100644
--- a/frontend/src/app/components/latest-blocks/latest-blocks.component.ts
+++ b/frontend/src/app/components/latest-blocks/latest-blocks.component.ts
@@ -29,7 +29,7 @@ export class LatestBlocksComponent implements OnInit, OnDestroy {
 
   constructor(
     private electrsApiService: ElectrsApiService,
-    private stateService: StateService,
+    public stateService: StateService,
     private seoService: SeoService,
     private websocketService: WebsocketService,
     private cd: ChangeDetectorRef,
diff --git a/frontend/src/app/components/tx-fee-rating/tx-fee-rating.component.ts b/frontend/src/app/components/tx-fee-rating/tx-fee-rating.component.ts
index 2055e995f..d5637421b 100644
--- a/frontend/src/app/components/tx-fee-rating/tx-fee-rating.component.ts
+++ b/frontend/src/app/components/tx-fee-rating/tx-fee-rating.component.ts
@@ -56,7 +56,7 @@ export class TxFeeRatingComponent implements OnInit, OnChanges, OnDestroy {
     this.medianFeeNeeded = block.medianFee;
 
     // Block not filled
-    if (block.weight < 4000000 * 0.95) {
+    if (block.weight < this.stateService.env.BLOCK_WEIGHT_UNITS * 0.95) {
       this.medianFeeNeeded = 1;
     }
 
diff --git a/frontend/src/app/dashboard/dashboard.component.html b/frontend/src/app/dashboard/dashboard.component.html
index e05d09094..0fde8306e 100644
--- a/frontend/src/app/dashboard/dashboard.component.html
+++ b/frontend/src/app/dashboard/dashboard.component.html
@@ -88,7 +88,7 @@
                   <td class="table-cell-transaction-count">{{ block.tx_count | number }}</td>
                   <td class="table-cell-size">
                     <div class="progress">
-                      <div class="progress-bar progress-mempool {{ network$ | async }}" role="progressbar" [ngStyle]="{'width': (block.weight / 4000000)*100 + '%' }">&nbsp;</div>
+                      <div class="progress-bar progress-mempool {{ network$ | async }}" role="progressbar" [ngStyle]="{'width': (block.weight / stateService.env.BLOCK_WEIGHT_UNITS)*100 + '%' }">&nbsp;</div>
                       <div class="progress-text" [innerHTML]="block.size | bytes: 2"></div>
                     </div>
                   </td>