diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
new file mode 100644
index 0000000..6e638ab
Binary files /dev/null and b/public/apple-touch-icon.png differ
diff --git a/public/favicon-96x96.png b/public/favicon-96x96.png
new file mode 100644
index 0000000..08f5e10
Binary files /dev/null and b/public/favicon-96x96.png differ
diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100644
index 0000000..9d12739
Binary files /dev/null and b/public/favicon.ico differ
diff --git a/public/favicon.svg b/public/favicon.svg
index 5fb33ce..70c6c75 100644
--- a/public/favicon.svg
+++ b/public/favicon.svg
@@ -1,56 +1,10 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg
-   width="24"
-   height="24"
-   viewBox="0 0 24 24"
-   fill="none"
-   stroke="currentColor"
-   stroke-width="2"
-   stroke-linecap="round"
-   stroke-linejoin="round"
-   class="lucide lucide-chart-column w-5 h-5 text-primary"
-   version="1.1"
-   id="svg4"
-   sodipodi:docname="favicon.svg"
-   inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)"
-   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">
-  <defs
-     id="defs4" />
-  <sodipodi:namedview
-     id="namedview4"
-     pagecolor="#ffffff"
-     bordercolor="#666666"
-     borderopacity="1.0"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:zoom="34.75"
-     inkscape:cx="11.985612"
-     inkscape:cy="12"
-     inkscape:window-width="1920"
-     inkscape:window-height="1051"
-     inkscape:window-x="0"
-     inkscape:window-y="17"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="svg4" />
-  <path
-     d="M3 3v16a2 2 0 0 0 2 2h16"
-     id="path1"
-     style="stroke:#2258c3;stroke-opacity:1" />
-  <path
-     d="M18 17V9"
-     id="path2"
-     style="stroke:#2258c3;stroke-opacity:1" />
-  <path
-     d="M13 17V5"
-     id="path3"
-     style="stroke:#2258c3;stroke-opacity:1" />
-  <path
-     d="M8 17v-3"
-     id="path4"
-     style="stroke:#2258c3;stroke-opacity:1" />
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chart-column w-5 h-5 text-primary" version="1.1" id="svg4" sodipodi:docname="favicon.svg" inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)" 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">
+  <defs id="defs4"></defs>
+  <sodipodi:namedview id="namedview4" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:zoom="34.75" inkscape:cx="11.985612" inkscape:cy="12" inkscape:window-width="1920" inkscape:window-height="1051" inkscape:window-x="0" inkscape:window-y="17" inkscape:window-maximized="1" inkscape:current-layer="svg4"></sodipodi:namedview>
+  <path d="M3 3v16a2 2 0 0 0 2 2h16" id="path1" style="stroke:#2258c3;stroke-opacity:1"></path>
+  <path d="M18 17V9" id="path2" style="stroke:#2258c3;stroke-opacity:1"></path>
+  <path d="M13 17V5" id="path3" style="stroke:#2258c3;stroke-opacity:1"></path>
+  <path d="M8 17v-3" id="path4" style="stroke:#2258c3;stroke-opacity:1"></path>
+</svg></svg><style>@media (prefers-color-scheme: light) { :root { filter: none; } }
+@media (prefers-color-scheme: dark) { :root { filter: none; } }
+</style></svg>
\ No newline at end of file
diff --git a/public/site.webmanifest b/public/site.webmanifest
new file mode 100644
index 0000000..4414029
--- /dev/null
+++ b/public/site.webmanifest
@@ -0,0 +1,21 @@
+{
+  "name": "Candle Annotator",
+  "short_name": "Candle Annotator",
+  "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/public/web-app-manifest-192x192.png b/public/web-app-manifest-192x192.png
new file mode 100644
index 0000000..73ac7b4
Binary files /dev/null and b/public/web-app-manifest-192x192.png differ
diff --git a/public/web-app-manifest-512x512.png b/public/web-app-manifest-512x512.png
new file mode 100644
index 0000000..f8cbe55
Binary files /dev/null and b/public/web-app-manifest-512x512.png differ
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 307b1eb..e5e3822 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -21,6 +21,18 @@ const jetbrainsMono = JetBrains_Mono({
 export const metadata: Metadata = {
   title: "Candle Annotator",
   description: "Annotate candlestick charts for ML training",
+  icons: {
+    icon: [
+      { url: "/favicon.ico", rel: "shortcut icon" },
+      { url: "/favicon-96x96.png", sizes: "96x96", type: "image/png" },
+      { url: "/favicon.svg", type: "image/svg+xml" },
+    ],
+    apple: [{ url: "/apple-touch-icon.png", sizes: "180x180" }],
+  },
+  manifest: "/site.webmanifest",
+  appleWebApp: {
+    title: "Candle Annotator",
+  },
 };
 
 export default function RootLayout({