diff --git a/icon2.svg b/icon2.svg
new file mode 100644
index 0000000..04cd59e
--- /dev/null
+++ b/icon2.svg
@@ -0,0 +1,91 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+
+<svg
+   width="1200"
+   height="1200"
+   viewBox="0 0 36 36"
+   id="Layer_1"
+   data-name="Layer 1"
+   version="1.1"
+   sodipodi:docname="icon2.svg"
+   inkscape:version="1.2.2 (1:1.2.2+202212051552+b0a8486541)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview19"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="0.30009657"
+     inkscape:cx="881.38295"
+     inkscape:cy="898.04425"
+     inkscape:window-width="1872"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Layer_1" />
+  <defs
+     id="defs4">
+    <style
+       id="style2">.cls-1{fill:none;stroke:#020202;stroke-miterlimit:10;stroke-width:1.91px;}</style>
+  </defs>
+  <circle
+     style="fill:#6750a4;fill-opacity:1;stroke:#6750a4;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+     id="path5226"
+     cx="17.347818"
+     cy="17.608673"
+     r="14.250001" />
+  <path
+     class="cls-1"
+     d="m 19.394845,22.479945 a 10.27,10.27 0 0 0 -5.200002,0.36 10.34,10.34 0 0 0 -3.92,2.33"
+     id="path6"
+     style="stroke:#ffffff;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     class="cls-1"
+     d="m 10.274843,9.839945 a 10.46,10.46 0 0 0 7.210002,2.87 10.46,10.46 0 0 0 7.21,-2.87"
+     id="path8"
+     style="stroke:#ffffff;stroke-width:1.5;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     class="cls-1"
+     d="m 21.304845,17.479945 c 0,-5.8 -1.71,-10.5 -3.82,-10.5 -2.110002,0 -3.820002,4.7 -3.820002,10.5 a 25.25,25.25 0 0 0 0.53,5.31 c 0.66,3.11 1.890002,5.19 3.290002,5.19"
+     id="path10"
+     style="stroke:#ffffff;stroke-width:1.5;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     class="cls-1"
+     d="m 19.394845,27.809945 a 10.94,10.94 0 0 1 -1.91,0.17 10.5,10.5 0 1 1 10.5,-10.5 H 6.9848426"
+     id="path16"
+     style="stroke:#ffffff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     d="m 25.25786,20.66097 c -0.29224,-0.08739 -0.623971,-0.142996 -0.987295,-0.142996 -1.63496,0 -2.953985,1.334629 -2.953985,2.971138 0,1.644454 1.326924,2.971139 2.953985,2.971139 1.627061,0 2.953906,-1.334629 2.953906,-2.971139 0,-0.611705 -0.181662,-1.183689 -0.497596,-1.652398"
+     stroke="#292d32"
+     stroke-width="1.5"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path1957"
+     style="fill:none;stroke:#ffffff;stroke-opacity:1;stroke-width:1.2;stroke-dasharray:none" />
+  <path
+     d="M 25.685319,20.740491 24.698024,19.604468"
+     stroke="#292d32"
+     stroke-width="1.5"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path1959"
+     style="fill:none;stroke:#ffffff;stroke-opacity:1;stroke-width:1.2;stroke-dasharray:none" />
+  <path
+     d="m 25.684608,20.74065 -1.15316,0.842088"
+     stroke="#292d32"
+     stroke-width="1.5"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path1961"
+     style="fill:none;stroke:#ffffff;stroke-opacity:1;stroke-width:1.2;stroke-dasharray:none" />
+</svg>
diff --git a/web/apple-touch-icon.png b/web/apple-touch-icon.png
new file mode 100644
index 0000000..53bc989
Binary files /dev/null and b/web/apple-touch-icon.png differ
diff --git a/web/favicon-96x96.png b/web/favicon-96x96.png
new file mode 100644
index 0000000..03957f0
Binary files /dev/null and b/web/favicon-96x96.png differ
diff --git a/web/favicon.ico b/web/favicon.ico
new file mode 100644
index 0000000..ef2df82
Binary files /dev/null and b/web/favicon.ico differ
diff --git a/web/favicon.svg b/web/favicon.svg
new file mode 100644
index 0000000..e91b9e1
--- /dev/null
+++ b/web/favicon.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="800px" height="800px" viewBox="0 0 24 24" id="Layer_1" data-name="Layer 1" sodipodi:docname="icon.svg" inkscape:version="1.2.2 (1:1.2.2+202212051552+b0a8486541)" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg"><metadata><rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/"><rdf:Description><dc:creator>RealFaviconGenerator</dc:creator><dc:source>https://realfavicongenerator.net</dc:source></rdf:Description></rdf:RDF></metadata><sodipodi:namedview id="namedview19" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" showgrid="false" inkscape:zoom="0.63234634" inkscape:cx="538.47073" inkscape:cy="557.44768" inkscape:window-width="1872" inkscape:window-height="1011" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="Layer_1"></sodipodi:namedview><defs id="defs4">
+    <style id="style2">.cls-1{fill:none;stroke:#020202;stroke-miterlimit:10;stroke-width:1.91px;}</style>
+  </defs><path class="cls-1" d="m 13.625348,16.952558 a 10.27,10.27 0 0 0 -5.2000024,0.36 10.34,10.34 0 0 0 -3.92,2.33" id="path6" style="stroke:#6750a4;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1"></path><path class="cls-1" d="m 4.5053456,4.3125576 a 10.46,10.46 0 0 0 7.2100024,2.87 10.46,10.46 0 0 0 7.21,-2.87" id="path8" style="stroke:#6750a4;stroke-width:1.5;stroke-dasharray:none;stroke-opacity:1"></path><path class="cls-1" d="m 15.535348,11.952558 c 0,-5.8000004 -1.71,-10.5000004 -3.82,-10.5000004 -2.1100024,0 -3.8200024,4.7 -3.8200024,10.5000004 a 25.25,25.25 0 0 0 0.53,5.31 c 0.66,3.11 1.8900024,5.19 3.2900024,5.19" id="path10" style="stroke:#6750a4;stroke-width:1.5;stroke-dasharray:none;stroke-opacity:1"></path><path class="cls-1" d="m 13.625348,22.282558 a 10.94,10.94 0 0 1 -1.91,0.17 10.5,10.5 0 1 1 10.5,-10.5 H 1.2153456" id="path16" style="stroke:#6750a4;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"></path><path d="m 20.337135,15.27369 c -0.37,-0.11 -0.79,-0.18 -1.25,-0.18 -2.07,0 -3.74,1.68 -3.74,3.74 0,2.07 1.68,3.74 3.74,3.74 2.06,0 3.7399,-1.68 3.7399,-3.74 0,-0.77 -0.23,-1.49 -0.63,-2.08" stroke="#292d32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" id="path1957" style="fill:none;stroke:#6750a4;stroke-opacity:1"></path><path d="m 20.878335,15.37379 -1.25,-1.43" stroke="#292d32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" id="path1959" style="fill:none;stroke:#6750a4;stroke-opacity:1"></path><path d="m 20.877435,15.37399 -1.46,1.06" stroke="#292d32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" id="path1961" style="fill:none;stroke:#6750a4;stroke-opacity:1"></path><style>@media (prefers-color-scheme: light) { :root { filter: none; } }
+@media (prefers-color-scheme: dark) { :root { filter: contrast(0.7407407407407407) brightness(2); } }
+</style></svg>
\ No newline at end of file
diff --git a/web/icon.svg b/web/icon.svg
new file mode 100644
index 0000000..618d27f
--- /dev/null
+++ b/web/icon.svg
@@ -0,0 +1,85 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+
+<svg
+   width="800px"
+   height="800px"
+   viewBox="0 0 24 24"
+   id="Layer_1"
+   data-name="Layer 1"
+   version="1.1"
+   sodipodi:docname="icon.svg"
+   inkscape:version="1.2.2 (1:1.2.2+202212051552+b0a8486541)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview19"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="0.63234634"
+     inkscape:cx="538.47073"
+     inkscape:cy="557.44768"
+     inkscape:window-width="1872"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Layer_1" />
+  <defs
+     id="defs4">
+    <style
+       id="style2">.cls-1{fill:none;stroke:#020202;stroke-miterlimit:10;stroke-width:1.91px;}</style>
+  </defs>
+  <path
+     class="cls-1"
+     d="m 13.625348,16.952558 a 10.27,10.27 0 0 0 -5.2000024,0.36 10.34,10.34 0 0 0 -3.92,2.33"
+     id="path6"
+     style="stroke:#6750a4;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     class="cls-1"
+     d="m 4.5053456,4.3125576 a 10.46,10.46 0 0 0 7.2100024,2.87 10.46,10.46 0 0 0 7.21,-2.87"
+     id="path8"
+     style="stroke:#6750a4;stroke-width:1.5;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     class="cls-1"
+     d="m 15.535348,11.952558 c 0,-5.8000004 -1.71,-10.5000004 -3.82,-10.5000004 -2.1100024,0 -3.8200024,4.7 -3.8200024,10.5000004 a 25.25,25.25 0 0 0 0.53,5.31 c 0.66,3.11 1.8900024,5.19 3.2900024,5.19"
+     id="path10"
+     style="stroke:#6750a4;stroke-width:1.5;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     class="cls-1"
+     d="m 13.625348,22.282558 a 10.94,10.94 0 0 1 -1.91,0.17 10.5,10.5 0 1 1 10.5,-10.5 H 1.2153456"
+     id="path16"
+     style="stroke:#6750a4;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     d="m 20.337135,15.27369 c -0.37,-0.11 -0.79,-0.18 -1.25,-0.18 -2.07,0 -3.74,1.68 -3.74,3.74 0,2.07 1.68,3.74 3.74,3.74 2.06,0 3.7399,-1.68 3.7399,-3.74 0,-0.77 -0.23,-1.49 -0.63,-2.08"
+     stroke="#292d32"
+     stroke-width="1.5"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path1957"
+     style="fill:none;stroke:#6750a4;stroke-opacity:1" />
+  <path
+     d="m 20.878335,15.37379 -1.25,-1.43"
+     stroke="#292d32"
+     stroke-width="1.5"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path1959"
+     style="fill:none;stroke:#6750a4;stroke-opacity:1" />
+  <path
+     d="m 20.877435,15.37399 -1.46,1.06"
+     stroke="#292d32"
+     stroke-width="1.5"
+     stroke-linecap="round"
+     stroke-linejoin="round"
+     id="path1961"
+     style="fill:none;stroke:#6750a4;stroke-opacity:1" />
+</svg>
diff --git a/web/index.html b/web/index.html
index b8f665e..3294ddd 100644
--- a/web/index.html
+++ b/web/index.html
@@ -3,35 +3,52 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>DynDns Updater</title>
+  <title>DynDNS Updater</title>
   <link rel="stylesheet" href="beer.min.css">
   <script type="module" src="beer.min.js" defer></script>
   <script src="alpine.min.js" defer></script>
+  <link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96" />
+  <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+  <link rel="shortcut icon" href="/favicon.ico" />
+  <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+  <meta name="apple-mobile-web-app-title" content="DynDNS Updater" />
+  <link rel="manifest" href="/site.webmanifest" />
 </head>
 
 <body>
   <main x-data="data" class="responsive">
-    <h2>DynDns Updater</h2>
-    <button class="small float-right" x-on:click="update">
-      <i>refresh</i>
-      <span>Update</span>
-    </button>
-    <table>
-      <tbody>
-        <tr>
-          <th>IPv4</td>
-          <td><span x-text="addrs.ipv4"></span></td>
-        </tr>
-        <tr>
-          <th>IPv6</td>
-          <td><span x-text="addrs.ipv6"></span></td>
-        </tr>
-        <tr>
-          <th>Last Update</td>
-          <td><span x-text="niceTime(lastUpdate)"></span></td>
-        </tr>
-      </tbody>
-    </table>
+    <div class="row header">
+      <img src="icon.svg" class="large" />
+      <div class="max">
+        <h5>DynDNS Updater</h5>
+        <div>Keep your DNS records up to date</div>
+      </div>
+    </div>
+    <article class="secondary-container">
+      <h6>
+        Current IPs
+        <button class="small float-right" x-on:click="update">
+          <i>refresh</i>
+          <span>Update</span>
+        </button>
+      </h6>
+      <table>
+        <tbody>
+          <tr>
+            <th>IPv4</td>
+            <td><span x-text="addrs.ipv4"></span></td>
+          </tr>
+          <tr>
+            <th>IPv6</td>
+            <td><span x-text="addrs.ipv6"></span></td>
+          </tr>
+          <tr>
+            <th>Last Update</td>
+            <td><span x-text="niceTime(lastUpdate)"></span></td>
+          </tr>
+        </tbody>
+      </table>
+    </article>
     <template x-for="domain in domains">
       <article>
         <h6>
@@ -152,7 +169,20 @@
   <style>
     main {
       overflow: unset;
-      margin-top: 2rem;
+      margin-top: 2rem !important;
+    }
+
+    .header {
+      margin-bottom: 2rem;
+    }
+
+    table {
+      margin: 0 !important;
+    }
+
+    .logo {
+      width: 5rem;
+      height: 5rem;
     }
 
     .float-right {
diff --git a/web/site.webmanifest b/web/site.webmanifest
new file mode 100644
index 0000000..4bafbc6
--- /dev/null
+++ b/web/site.webmanifest
@@ -0,0 +1,21 @@
+{
+  "name": "DynDNS Updater",
+  "short_name": "DynDNS Updater",
+  "icons": [
+    {
+      "src": "/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}
\ No newline at end of file
diff --git a/web/web-app-manifest-192x192.png b/web/web-app-manifest-192x192.png
new file mode 100644
index 0000000..9eb1c6f
Binary files /dev/null and b/web/web-app-manifest-192x192.png differ
diff --git a/web/web-app-manifest-512x512.png b/web/web-app-manifest-512x512.png
new file mode 100644
index 0000000..8e7219a
Binary files /dev/null and b/web/web-app-manifest-512x512.png differ