diff --git a/synculous-client/public/icon-192.png b/synculous-client/public/icon-192.png
index f8175ff..f45edf9 100644
Binary files a/synculous-client/public/icon-192.png and b/synculous-client/public/icon-192.png differ
diff --git a/synculous-client/public/icon-512.png b/synculous-client/public/icon-512.png
index 9176fe3..460c1d2 100644
Binary files a/synculous-client/public/icon-512.png and b/synculous-client/public/icon-512.png differ
diff --git a/synculous-client/public/logo.png b/synculous-client/public/logo.png
new file mode 100644
index 0000000..9b2c83f
Binary files /dev/null and b/synculous-client/public/logo.png differ
diff --git a/synculous-client/src/app/dashboard/layout.tsx b/synculous-client/src/app/dashboard/layout.tsx
index 7eec223..130435e 100644
--- a/synculous-client/src/app/dashboard/layout.tsx
+++ b/synculous-client/src/app/dashboard/layout.tsx
@@ -15,7 +15,7 @@ import {
   SettingsIcon,
   LogOutIcon,
   CopyIcon,
-  HeartIcon,
+
   SunIcon,
   MoonIcon,
 } from '@/components/ui/Icons';
@@ -85,9 +85,7 @@ export default function DashboardLayout({
       <header className="bg-white dark:bg-gray-900 border-b border-gray-200 dark:border-gray-700 sticky top-0 z-10">
         <div className="flex items-center justify-between px-4 py-3">
           <div className="flex items-center gap-2">
-            <div className="w-8 h-8 bg-gradient-to-br from-indigo-500 to-pink-500 rounded-lg flex items-center justify-center">
-              <HeartIcon className="text-white" size={16} />
-            </div>
+            <img src="/logo.png" alt="Synculous" className="w-8 h-8" />
             <span className="font-bold text-gray-900 dark:text-gray-100">Synculous</span>
           </div>
           <div className="flex items-center gap-2">
diff --git a/synculous-client/src/app/favicon.ico b/synculous-client/src/app/favicon.ico
index 438d3ec..e9fa247 100644
Binary files a/synculous-client/src/app/favicon.ico and b/synculous-client/src/app/favicon.ico differ
diff --git a/synculous-client/src/app/login/page.tsx b/synculous-client/src/app/login/page.tsx
index e16018a..af49903 100644
--- a/synculous-client/src/app/login/page.tsx
+++ b/synculous-client/src/app/login/page.tsx
@@ -3,7 +3,7 @@
 import { useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { useAuth } from '@/components/auth/AuthProvider';
-import { HeartIcon } from '@/components/ui/Icons';
+
 
 export default function LoginPage() {
   const [isLogin, setIsLogin] = useState(true);
@@ -38,9 +38,7 @@ export default function LoginPage() {
     <div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-indigo-500 via-purple-500 to-pink-500 p-4">
       <div className="bg-white dark:bg-gray-800 rounded-2xl shadow-2xl w-full max-w-md p-8">
         <div className="flex flex-col items-center mb-8">
-          <div className="w-16 h-16 bg-gradient-to-br from-indigo-500 to-pink-500 rounded-2xl flex items-center justify-center mb-4">
-            <HeartIcon className="text-white" size={32} />
-          </div>
+          <img src="/logo.png" alt="Synculous" className="w-16 h-16 mb-4" />
           <h1 className="text-2xl font-bold text-gray-900 dark:text-gray-100">Synculous</h1>
           <p className="text-gray-500 dark:text-gray-400 mt-1">
             {isLogin ? 'Welcome back!' : 'Create your account'}