diff --git a/package.json b/package.json
index 4581650..5b17ee3 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "@angular/platform-browser": "~8.2.14",
     "@angular/platform-browser-dynamic": "~8.2.14",
     "@angular/router": "~8.2.14",
+    "bootstrap": "^4.4.1",
     "hammerjs": "^2.0.8",
     "ipfs-css": "^0.13.1",
     "rxjs": "~6.5.3",
diff --git a/src/app/pages/pages.component.html b/src/app/pages/pages.component.html
index 59bc4e5..78d8bd1 100644
--- a/src/app/pages/pages.component.html
+++ b/src/app/pages/pages.component.html
@@ -1,12 +1,14 @@
-<div fxLayout="column" fxLayoutAlign="start center" fxLayoutGap="1em">
+<div fxLayout="column" fxLayoutAlign="space-evenly center" fxLayoutGap="1em" class="container">
 
-  <!-- Form -->
-  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em" (submit)="cache()">
+  <h1>Public IPFS Cacher</h1>
+
+  <!-- IPFS -->
+  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em" (submit)="cacheIPFS()">
 
     <!-- Hash -->
     <mat-form-field>
-      <mat-label>Hash</mat-label>
-      <input matInput [(ngModel)]="hash" name="hash">
+      <mat-label>IPFS</mat-label>
+      <input matInput [(ngModel)]="ipfs" name="ipfs">
     </mat-form-field>
 
     <!-- Cache -->
@@ -14,7 +16,22 @@
 
   </form>
 
-  <mat-progress-bar *ngIf="hash && dataSource && gateways" mode="determinate" [value]="dataSource.data.length / gateways.length * 100">
+  <!-- IPNS -->
+  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em" (submit)="cacheIPNS()">
+
+    <!-- Hash -->
+    <mat-form-field>
+      <mat-label>IPNS</mat-label>
+      <input matInput [(ngModel)]="ipns" name="ipns">
+    </mat-form-field>
+
+    <!-- Cache -->
+    <button mat-flat-button color="primary" type="submit">Cache</button>
+
+  </form>
+
+  <mat-progress-bar *ngIf="(ipfs || ipns) && dataSource && gateways" mode="determinate"
+    [value]="dataSource.data.length / gateways.length * 100">
   </mat-progress-bar>
 
   <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
@@ -34,10 +51,14 @@
     <ng-container matColumnDef="gateway">
       <th mat-header-cell *matHeaderCellDef> Gateway </th>
       <td mat-cell *matCellDef="let element">
-        <a [href]="element.gateway" [ngClass]="{
-          'aqua-muted': element.error,
-          aqua: !element.error
-        }"> {{ element.gateway }} </a>
+        <div [ngSwitch]="element.error">
+          <div *ngSwitchCase="null">
+            <strong><a [href]="element.gateway" class="aqua"> {{ element.gateway }} </a></strong>
+          </div>
+          <div *ngSwitchDefault>
+            <a [href]="element.gateway" class="aqua-muted"> {{ element.gateway }} </a>
+          </div>
+        </div>
       </td>
     </ng-container>
 
@@ -46,17 +67,19 @@
   </table>
 
   <!-- About -->
-  <h3>About</h3>
-  <p>
-    This allows you to cache a specific IPFS hash to a bunch of public gateways.
-    It's inspired from <a href="https://github.com/ipfs/public-gateway-checker">github.com/ipfs/public-gateway-checker</a>.
-    The source code is available at <a
-      href="https://gitlab.com/NatoBoram/public-gateway-checker">gitlab.com/NatoBoram/public-gateway-checker</a>.
-  </p>
-  <p>
-    If you'd like to add a new public gateway,
-    please go to <a href="https://github.com/ipfs/public-gateway-checker">github.com/ipfs/public-gateway-checker</a>,
-    submit a pull request then open an issue <a href="https://gitlab.com/NatoBoram/public-gateway-cacher/issues/new">here</a>.
-  </p>
+  <div fxLayout="column" fxLayoutAlign="space-evenly start" fxLayoutGap="1em">
+    <h3>About</h3>
+    <p>
+      This allows you to cache a specific IPFS hash to a bunch of public gateways.
+      It's inspired from <a href="https://github.com/ipfs/public-gateway-checker">github.com/ipfs/public-gateway-checker</a>.
+      The source code is available at <a
+        href="https://gitlab.com/NatoBoram/public-gateway-checker">gitlab.com/NatoBoram/public-gateway-checker</a>.
+    </p>
+    <p>
+      If you'd like to add a new public gateway,
+      please go to <a href="https://github.com/ipfs/public-gateway-checker">github.com/ipfs/public-gateway-checker</a>,
+      submit a pull request then open an issue <a href="https://gitlab.com/NatoBoram/public-gateway-cacher/issues/new">here</a>.
+    </p>
+  </div>
 
 </div>
diff --git a/src/app/pages/pages.component.scss b/src/app/pages/pages.component.scss
index 9fff96f..a469231 100644
--- a/src/app/pages/pages.component.scss
+++ b/src/app/pages/pages.component.scss
@@ -2,6 +2,10 @@
   min-width: 30em;
 }
 
+.mat-table {
+  width: 100%;
+}
+
 .mat-progress-bar {
   max-width: 60em;
 }
diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts
index d7f0fda..2b80ab1 100644
--- a/src/app/pages/pages.component.ts
+++ b/src/app/pages/pages.component.ts
@@ -11,7 +11,8 @@ import { GatewayService } from '../services/gateway.service';
 export class PagesComponent implements OnInit {
 
   gateways: string[];
-  hash: string;
+  ipfs: string;
+  ipns: string;
   dataSource: MatTableDataSource<Result>;
   displayedColumns = [
     'error',
@@ -29,17 +30,24 @@ export class PagesComponent implements OnInit {
     this.gatewayService.list().subscribe(gateways => this.gateways = gateways);
   }
 
-  cache(): void {
-    const hash = this.hash;
+  cacheIPFS(): void {
+    this.cache('ipfs', this.ipfs);
+  }
+
+  cacheIPNS(): void {
+    this.cache('ipns', this.ipns);
+  }
+
+  cache(type: string, hash: string): void {
     this.dataSource.data = [];
     this.matTable.renderRows();
 
     this.gateways.forEach(gateway => {
-      this.gatewayService.get(gateway, hash).subscribe(_ => {
-        this.dataSource.data.push({ gateway: `${gateway.replace(':hash', hash)}`, error: null });
+      this.gatewayService.get(gateway, type, hash).subscribe(_ => {
+        this.dataSource.data.push({ gateway: `${gateway.replace(':type', type).replace(':hash', hash)}`, error: null });
         this.matTable.renderRows();
       }, (error: HttpErrorResponse) => {
-        this.dataSource.data.push({ gateway: `${gateway.replace(':hash', hash)}`, error });
+        this.dataSource.data.push({ gateway: `${gateway.replace(':type', type).replace(':hash', hash)}`, error });
         this.matTable.renderRows();
       });
     });
diff --git a/src/app/services/gateway.service.ts b/src/app/services/gateway.service.ts
index f3e46e1..0bff4fe 100644
--- a/src/app/services/gateway.service.ts
+++ b/src/app/services/gateway.service.ts
@@ -15,8 +15,8 @@ export class GatewayService {
     return this.http.get<string[]>('/assets/json/gateways.json');
   }
 
-  get(gateway: string, hash: string): Observable<Blob> {
-    return this.http.get<Blob>(`${gateway.replace(':hash', hash)}#x-ipfs-companion-no-redirect`, {
+  get(gateway: string, type: string, hash: string): Observable<Blob> {
+    return this.http.get<Blob>(`${gateway.replace(':type', type).replace(':hash', hash)}#x-ipfs-companion-no-redirect`, {
       responseType: 'blob' as 'json'
     });
   }
diff --git a/src/assets/json/gateways.json b/src/assets/json/gateways.json
index ab9987f..8d7d3d3 100644
--- a/src/assets/json/gateways.json
+++ b/src/assets/json/gateways.json
@@ -1,39 +1,39 @@
 [
-  "https://ipfs.io/ipfs/:hash",
-  "https://gateway.ipfs.io/ipfs/:hash",
-  "https://ipfs.infura.io/ipfs/:hash",
-  "https://rx14.co.uk/ipfs/:hash",
-  "https://ninetailed.ninja/ipfs/:hash",
+  "https://ipfs.io/:type/:hash",
+  "https://gateway.ipfs.io/:type/:hash",
+  "https://ipfs.infura.io/:type/:hash",
+  "https://rx14.co.uk/:type/:hash",
+  "https://ninetailed.ninja/:type/:hash",
   "https://ipfs.globalupload.io/:hash",
-  "https://ipfs.jes.xxx/ipfs/:hash",
-  "https://siderus.io/ipfs/:hash",
-  "https://eu.siderus.io/ipfs/:hash",
-  "https://na.siderus.io/ipfs/:hash",
-  "https://ap.siderus.io/ipfs/:hash",
-  "https://10.via0.com/ipfs/:hash",
-  "https://ipfs.eternum.io/ipfs/:hash",
-  "https://hardbin.com/ipfs/:hash",
-  "https://ipfs.wa.hle.rs/ipfs/:hash",
-  "https://gateway.blocksec.com/ipfs/:hash",
-  "https://ipfs.renehsz.com/ipfs/:hash",
-  "https://cloudflare-ipfs.com/ipfs/:hash",
+  "https://ipfs.jes.xxx/:type/:hash",
+  "https://siderus.io/:type/:hash",
+  "https://eu.siderus.io/:type/:hash",
+  "https://na.siderus.io/:type/:hash",
+  "https://ap.siderus.io/:type/:hash",
+  "https://10.via0.com/:type/:hash",
+  "https://ipfs.eternum.io/:type/:hash",
+  "https://hardbin.com/:type/:hash",
+  "https://ipfs.wa.hle.rs/:type/:hash",
+  "https://gateway.blocksec.com/:type/:hash",
+  "https://ipfs.renehsz.com/:type/:hash",
+  "https://cloudflare-ipfs.com/:type/:hash",
   "https://ipns.co/:hash",
-  "https://ipfs.mrh.io/ipfs/:hash",
-  "https://gateway.originprotocol.com/ipfs/:hash",
-  "https://gateway.pinata.cloud/ipfs/:hash",
-  "https://ipfs.doolta.com/ipfs/:hash",
-  "https://ipfs.sloppyta.co/ipfs/:hash",
-  "https://ipfs.busy.org/ipfs/:hash",
-  "https://ipfs.greyh.at/ipfs/:hash",
-  "https://gateway.serph.network/ipfs/:hash",
-  "https://jorropo.ovh/ipfs/:hash",
-  "https://gateway.temporal.cloud/ipfs/:hash",
-  "https://ipfs.fooock.com/ipfs/:hash",
-  "https://cdn.cwinfo.net/ipfs/:hash",
-  "https://ipfs.privacytools.io/ipfs/:hash",
-  "https://ipfs.jeroendeneef.com/ipfs/:hash",
-  "https://permaweb.io/ipfs/:hash",
-  "https://ipfs.stibarc.gq/ipfs/:hash",
-  "https://ipfs.best-practice.se/ipfs/:hash",
-  "https://lineageos-on-ipfs.com/ipfs/:hash"
+  "https://ipfs.mrh.io/:type/:hash",
+  "https://gateway.originprotocol.com/:type/:hash",
+  "https://gateway.pinata.cloud/:type/:hash",
+  "https://ipfs.doolta.com/:type/:hash",
+  "https://ipfs.sloppyta.co/:type/:hash",
+  "https://ipfs.busy.org/:type/:hash",
+  "https://ipfs.greyh.at/:type/:hash",
+  "https://gateway.serph.network/:type/:hash",
+  "https://jorropo.ovh/:type/:hash",
+  "https://gateway.temporal.cloud/:type/:hash",
+  "https://ipfs.fooock.com/:type/:hash",
+  "https://cdn.cwinfo.net/:type/:hash",
+  "https://ipfs.privacytools.io/:type/:hash",
+  "https://ipfs.jeroendeneef.com/:type/:hash",
+  "https://permaweb.io/:type/:hash",
+  "https://ipfs.stibarc.gq/:type/:hash",
+  "https://ipfs.best-practice.se/:type/:hash",
+  "https://lineageos-on-ipfs.com/:type/:hash"
 ]
diff --git a/src/styles.scss b/src/styles.scss
index ef7f9ed..b3fa140 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -36,3 +36,5 @@ body {
   margin: 0;
   font-family: Roboto, "Helvetica Neue", sans-serif;
 }
+
+@import '~bootstrap/scss/bootstrap-grid.scss';
diff --git a/yarn.lock b/yarn.lock
index 1d83864..ddaae0e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1738,6 +1738,11 @@ bonjour@^3.5.0:
     multicast-dns "^6.0.1"
     multicast-dns-service-types "^1.1.0"
 
+bootstrap@^4.4.1:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.4.1.tgz#8582960eea0c5cd2bede84d8b0baf3789c3e8b01"
+  integrity sha512-tbx5cHubwE6e2ZG7nqM3g/FZ5PQEDMWmMGNrCUBVRPHXTJaH7CBDdsLeu3eCh3B1tzAxTnAbtmrzvWEvT2NNEA==
+
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"