diff --git a/.github/ISSUE_TEMPLATE/bug.md b/.github/ISSUE_TEMPLATE/bug.md
index 6407adc..d530bac 100644
--- a/.github/ISSUE_TEMPLATE/bug.md
+++ b/.github/ISSUE_TEMPLATE/bug.md
@@ -1,11 +1,14 @@
 # [Title]
 
 ## Description
+
 [Please write a description of the bug. Give as much info as possible.]
 
 ### Steps to reproduce
+
 1.
 2.
 
 ### Screenshot
+
 [if any]
diff --git a/.github/ISSUE_TEMPLATE/feature.md b/.github/ISSUE_TEMPLATE/feature.md
index 0256a33..784903b 100644
--- a/.github/ISSUE_TEMPLATE/feature.md
+++ b/.github/ISSUE_TEMPLATE/feature.md
@@ -1,4 +1,5 @@
 # [Title]
 
 ## Idea
+
 [Give a description of the idea. Be as clear and concise as possible. The clearer your description, the higher the chance it'll be picked up.]
diff --git a/.gitignore b/.gitignore
index 113a3e3..78b984e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -40,4 +40,8 @@ next-env.d.ts
 .vscode
 
 public/images/users
-!public/images/users/unnamed.jpeg
+!public/images/users/unnamed.jpg
+
+# These are generated on build-time
+sw*
+workbox-*
diff --git a/README.md b/README.md
index 7a6714d..83f8087 100644
--- a/README.md
+++ b/README.md
@@ -33,4 +33,5 @@ $ bun dev
 Open http://localhost:3000 with your browser to see the result.
 
 ## Contributing
+
 Contibutions are welcome! If you want to add a cool feature or do some kind of improvement, feel free to open an [issue](https://github.com/brainstudnl/blaco/issues/new/choose) or [pull request](https://github.com/brainstudnl/blaco/compare)!
diff --git a/bun.lockb b/bun.lockb
index fc5dcb3..7f0dca3 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/next.config.mjs b/next.config.mjs
index 5b5785d..98b4340 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -1,4 +1,5 @@
 import createMDX from '@next/mdx';
+import nextPwa from 'next-pwa';
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
@@ -8,4 +9,10 @@ const nextConfig = {
 
 const withMDX = createMDX();
 
-export default withMDX(nextConfig);
+const withPWA = nextPwa({
+  dest: 'public',
+  disable: process.env.NODE_ENV === 'development',
+  register: true,
+});
+
+export default withPWA(withMDX(nextConfig));
diff --git a/package.json b/package.json
index a98a0af..58b2feb 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "classnames": "2.5.1",
     "eslint-plugin-unused-imports": "3.2.0",
     "next": "14.2.3",
+    "next-pwa": "5.6.0",
     "primeicons": "7.0.0",
     "primereact": "10.6.6",
     "prisma": "5.15.0",
diff --git a/public/favicon.ico b/public/favicon.ico
index 4570eb8..48c9ce9 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/public/images/icons/browserconfig.xml b/public/images/icons/browserconfig.xml
new file mode 100644
index 0000000..e165441
--- /dev/null
+++ b/public/images/icons/browserconfig.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/images/icons/mstile-150x150.png"/>
+            <TileColor>#FF6E32</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>
diff --git a/public/images/icons/icon-192x192.png b/public/images/icons/icon-192x192.png
new file mode 100644
index 0000000..a7be2fa
Binary files /dev/null and b/public/images/icons/icon-192x192.png differ
diff --git a/public/images/icons/icon-512x512.png b/public/images/icons/icon-512x512.png
new file mode 100644
index 0000000..57de1d9
Binary files /dev/null and b/public/images/icons/icon-512x512.png differ
diff --git a/public/images/icons/mstile-150x150.png b/public/images/icons/mstile-150x150.png
new file mode 100644
index 0000000..3fd8ace
Binary files /dev/null and b/public/images/icons/mstile-150x150.png differ
diff --git a/public/manifest.json b/public/manifest.json
new file mode 100644
index 0000000..8d49ee8
--- /dev/null
+++ b/public/manifest.json
@@ -0,0 +1,22 @@
+{
+  "name": "Blaco",
+  "short_name": "Blaco",
+  "theme_color": "#121212",
+  "background_color": "#121212",
+  "start_url": "/",
+  "display": "fullscreen",
+  "orientation": "portrait",
+  "icons": [
+    {
+      "src": "/images/icons/icon-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "/images/icons/icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
index f65200e..ae997a4 100644
--- a/src/pages/_document.tsx
+++ b/src/pages/_document.tsx
@@ -10,6 +10,17 @@ export default function Document() {
           rel="stylesheet"
           href="/themes/lara-dark-purple/theme.css"
         />
+        <meta name="application-name" content="Blaco" />
+        <meta name="apple-mobile-web-app-capable" content="yes" />
+        <meta name="apple-mobile-web-app-status-bar-style" content="default" />
+        <meta name="apple-mobile-web-app-title" content="PWA App" />
+        <meta name="description" content="Best PWA App in the world" />
+        <meta name="format-detection" content="telephone=no" />
+        <meta name="mobile-web-app-capable" content="yes" />
+        <meta name="msapplication-config" content="/icons/browserconfig.xml" />
+        <meta name="msapplication-TileColor" content="#FF6E32" />
+        <meta name="msapplication-tap-highlight" content="no" />
+        <meta name="theme-color" content="#121212" />
       </Head>
       <body>
         <Main />