diff --git a/webapp/public/android-chrome-192x192.png b/webapp/public/android-chrome-192x192.png
new file mode 100644
index 00000000..bd69072d
Binary files /dev/null and b/webapp/public/android-chrome-192x192.png differ
diff --git a/webapp/public/android-chrome-512x512.png b/webapp/public/android-chrome-512x512.png
new file mode 100644
index 00000000..ee73d80b
Binary files /dev/null and b/webapp/public/android-chrome-512x512.png differ
diff --git a/webapp/public/apple-touch-icon.png b/webapp/public/apple-touch-icon.png
new file mode 100644
index 00000000..09ea3e46
Binary files /dev/null and b/webapp/public/apple-touch-icon.png differ
diff --git a/webapp/public/browserconfig.xml b/webapp/public/browserconfig.xml
new file mode 100644
index 00000000..b3930d0f
--- /dev/null
+++ b/webapp/public/browserconfig.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>
diff --git a/webapp/public/favicon-16x16-dark.png b/webapp/public/favicon-16x16-dark.png
new file mode 100644
index 00000000..1a32d960
Binary files /dev/null and b/webapp/public/favicon-16x16-dark.png differ
diff --git a/webapp/public/favicon-16x16-light.png b/webapp/public/favicon-16x16-light.png
new file mode 100644
index 00000000..c35b7343
Binary files /dev/null and b/webapp/public/favicon-16x16-light.png differ
diff --git a/webapp/public/favicon-32x32-dark.png b/webapp/public/favicon-32x32-dark.png
new file mode 100644
index 00000000..d0cead60
Binary files /dev/null and b/webapp/public/favicon-32x32-dark.png differ
diff --git a/webapp/public/favicon-32x32-light.png b/webapp/public/favicon-32x32-light.png
new file mode 100644
index 00000000..5bd05b79
Binary files /dev/null and b/webapp/public/favicon-32x32-light.png differ
diff --git a/webapp/public/favicon.ico b/webapp/public/favicon.ico
deleted file mode 100644
index 180bb1ae..00000000
Binary files a/webapp/public/favicon.ico and /dev/null differ
diff --git a/webapp/public/mstile-144x144.png b/webapp/public/mstile-144x144.png
new file mode 100644
index 00000000..17377988
Binary files /dev/null and b/webapp/public/mstile-144x144.png differ
diff --git a/webapp/public/mstile-150x150.png b/webapp/public/mstile-150x150.png
new file mode 100644
index 00000000..cd71060e
Binary files /dev/null and b/webapp/public/mstile-150x150.png differ
diff --git a/webapp/public/mstile-310x150.png b/webapp/public/mstile-310x150.png
new file mode 100644
index 00000000..d97e1cf7
Binary files /dev/null and b/webapp/public/mstile-310x150.png differ
diff --git a/webapp/public/mstile-310x310.png b/webapp/public/mstile-310x310.png
new file mode 100644
index 00000000..0efc35aa
Binary files /dev/null and b/webapp/public/mstile-310x310.png differ
diff --git a/webapp/public/mstile-70x70.png b/webapp/public/mstile-70x70.png
new file mode 100644
index 00000000..9f2d6618
Binary files /dev/null and b/webapp/public/mstile-70x70.png differ
diff --git a/webapp/public/safari-pinned-tab.svg b/webapp/public/safari-pinned-tab.svg
new file mode 100644
index 00000000..068ccd5b
--- /dev/null
+++ b/webapp/public/safari-pinned-tab.svg
@@ -0,0 +1,32 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M2533 6411 c-102 -35 -172 -114 -194 -219 -14 -69 7 -165 48 -221 16
+-21 111 -112 213 -203 102 -91 213 -199 246 -239 225 -272 339 -563 360 -921
+l7 -110 -1220 -1221 c-767 -768 -1233 -1242 -1255 -1277 -113 -176 -153 -326
+-145 -542 6 -183 49 -321 142 -463 50 -77 183 -210 260 -260 141 -92 280 -135
+459 -142 198 -8 335 24 502 117 74 41 164 129 1306 1269 l1227 1224 48 -18
+c39 -15 86 -56 251 -219 l203 -201 -16 -44 c-66 -187 75 -384 275 -384 126 0
+100 -22 792 671 694 696 664 659 662 793 -1 106 -61 201 -157 251 -58 29 -160
+36 -223 14 l-48 -16 -174 172 c-95 95 -189 194 -207 219 -55 73 -65 133 -65
+375 l0 211 -30 59 c-24 49 -93 122 -417 445 -470 467 -575 552 -838 679 -139
+67 -251 109 -385 144 -196 52 -258 58 -725 66 -719 13 -841 12 -902 -9z m1388
+-600 c196 -40 377 -116 549 -229 65 -43 166 -137 433 -401 l347 -345 0 -150
+c0 -234 43 -394 145 -551 21 -33 135 -157 252 -275 l213 -216 -228 -227 c-125
+-125 -232 -227 -237 -227 -6 0 -102 92 -215 205 -332 333 -460 395 -820 395
+l-155 0 -207 208 -206 207 -5 290 c-5 313 -14 390 -67 591 -60 227 -154 434
+-288 633 l-83 124 238 -6 c180 -4 261 -11 334 -26z m-334 -2223 c123 -123 223
+-227 223 -233 0 -6 -478 -488 -1062 -1071 -857 -855 -1073 -1066 -1113 -1085
+-41 -19 -66 -24 -140 -24 -79 0 -96 4 -142 28 -66 34 -116 84 -150 150 -24 46
+-28 63 -28 142 0 74 5 99 24 140 19 40 230 256 1085 1113 583 584 1065 1062
+1071 1062 5 0 110 -100 232 -222z"/>
+</g>
+</svg>
diff --git a/webapp/public/site.webmanifest b/webapp/public/site.webmanifest
new file mode 100644
index 00000000..b20abb7c
--- /dev/null
+++ b/webapp/public/site.webmanifest
@@ -0,0 +1,19 @@
+{
+    "name": "",
+    "short_name": "",
+    "icons": [
+        {
+            "src": "/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}
diff --git a/webapp/src/index.html b/webapp/src/index.html
index efa75a11..53ba96d1 100644
--- a/webapp/src/index.html
+++ b/webapp/src/index.html
@@ -5,7 +5,15 @@
     <title>Hephaestus</title>
     <base href="/" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16-light.png" media="(prefers-color-scheme: light)" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32-light.png" media="(prefers-color-scheme: light)" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16-dark.png" media="(prefers-color-scheme: dark)" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32-dark.png" media="(prefers-color-scheme: dark)" />
+    <link rel="manifest" href="/site.webmanifest" />
+    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#000000" />
+    <meta name="msapplication-TileColor" content="#da532c" />
+    <meta name="theme-color" content="#ffffff" />
   </head>
   <script>
     const theme = localStorage.getItem('theme');