diff --git a/frontend/src/app/components/block/block-preview.component.html b/frontend/src/app/components/block/block-preview.component.html
index 666714b24..2535486de 100644
--- a/frontend/src/app/components/block/block-preview.component.html
+++ b/frontend/src/app/components/block/block-preview.component.html
@@ -4,15 +4,18 @@
   </app-preview-title>
   <div class="row">
     <div class="col-sm">
-      <div class="row d-flex justify-content-between">
-        <div class="title-wrapper">
+      <div class="row">
+        <div class="block-titles">
           <h1 class="title">
             <ng-template [ngIf]="blockHeight === 0"><ng-container i18n="@@2303359202781425764">Genesis</ng-container></ng-template>
             <ng-template [ngIf]="blockHeight" i18n="shared.block-title">{{ blockHeight }}</ng-template>
           </h1>
+          <div class="blockhash" *ngIf="blockHash">
+            <h2 class="truncate right">{{ blockHash.slice(0,32) }}</h2>
+            <h2 class="truncate left">{{ blockHash.slice(32) }}</h2>
+          </div>
         </div>
       </div>
-      <a class="subtitle truncated" [routerLink]="['/block/' | relativeUrl, blockHash]" *ngIf="blockHash"><span class="first">{{blockHash.slice(0,-4)}}</span><span class="last-four">{{blockHash.slice(-4)}}</span></a>
       <table class="table table-borderless table-striped">
         <tbody>
           <!-- <tr>
diff --git a/frontend/src/app/components/block/block-preview.component.scss b/frontend/src/app/components/block/block-preview.component.scss
index 2d8d5f6ba..45e9f9292 100644
--- a/frontend/src/app/components/block/block-preview.component.scss
+++ b/frontend/src/app/components/block/block-preview.component.scss
@@ -1,10 +1,47 @@
 .table {
   font-size: 32px;
-  margin-top: 6px;
+  margin-top: 36px;
 }
 
-.title-wrapper {
+.block-titles {
+  margin: 0;
   padding-left: 15px;
+  padding-right: 15px;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  flex-grow: 1;
+
+  .title {
+    flex-shrink: 0;
+    flex-grow:  0;
+    margin-right: 30px;
+    font-size: 64px;
+  }
+
+  .blockhash {
+    width: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    font-family: Consolas,Liberation Mono,Courier New,monospace;
+    font-size: 32px;
+    text-align: right;
+
+    .truncate {
+      max-width: 100%;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      margin: 0;
+
+      &.left {
+        direction: rtl;
+      }
+    }
+  }
 }
 
 .chart-container {