diff --git a/docs/images/FoodBank - Logo - BW - Transparent.png b/docs/images/FoodBank - Logo - BW - Transparent.png
new file mode 100644
index 0000000..806e3d9
Binary files /dev/null and b/docs/images/FoodBank - Logo - BW - Transparent.png differ
diff --git a/docs/images/FoodBank - Logo - Blue - Transparent.png b/docs/images/FoodBank - Logo - Blue - Transparent.png
new file mode 100644
index 0000000..b6bad07
Binary files /dev/null and b/docs/images/FoodBank - Logo - Blue - Transparent.png differ
diff --git a/docs/index.html b/docs/index.html
index 8c1dd11..4f46558 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -7,6 +7,7 @@
 <div class="bg-gray-100 min-h-screen">
   <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
     <div class="text-center">
+      <img src="images/FoodBank - Logo - BW - Transparent.png" alt="FoodBank Logo" class="h-32 mx-auto mb-8">
       <h1 class="text-4xl font-bold text-gray-900 sm:text-5xl md:text-6xl">
         Food Bank Inventory Management
       </h1>
diff --git a/packages/client/.vite/deps_temp_9bf9597c/package.json b/packages/client/.vite/deps_temp_9bf9597c/package.json
new file mode 100644
index 0000000..3dbc1ca
--- /dev/null
+++ b/packages/client/.vite/deps_temp_9bf9597c/package.json
@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}
diff --git a/packages/client/src/assets/images/FoodBank - Logo - BW - Transparent.png b/packages/client/src/assets/images/FoodBank - Logo - BW - Transparent.png
new file mode 100644
index 0000000..806e3d9
Binary files /dev/null and b/packages/client/src/assets/images/FoodBank - Logo - BW - Transparent.png differ
diff --git a/packages/client/src/assets/images/FoodBank - Logo - Blue - Transparent.png b/packages/client/src/assets/images/FoodBank - Logo - Blue - Transparent.png
new file mode 100644
index 0000000..b6bad07
Binary files /dev/null and b/packages/client/src/assets/images/FoodBank - Logo - Blue - Transparent.png differ
diff --git a/packages/client/src/components/layout/Navigation.tsx b/packages/client/src/components/layout/Navigation.tsx
index 71a8434..a18a3ce 100644
--- a/packages/client/src/components/layout/Navigation.tsx
+++ b/packages/client/src/components/layout/Navigation.tsx
@@ -3,6 +3,7 @@ import { Link, useLocation } from 'react-router-dom';
 import { Disclosure, Menu, Transition } from '@headlessui/react';
 import { Bars3Icon, XMarkIcon, UserCircleIcon } from '@heroicons/react/24/outline';
 import clsx from 'clsx';
+import logo from '../../assets/images/FoodBank - Logo - Blue - Transparent.png';
 
 const navigation = [
   { name: 'Dashboard', href: '/' },
@@ -18,7 +19,9 @@ export function Navigation() {
       <div className="container mx-auto px-8">
         <div className="flex h-20 items-center justify-between">
           <div className="flex items-center flex-shrink-0">
-            <span className="text-3xl font-bold text-blue-600">FoodBank</span>
+            <Link to="/" className="flex items-center">
+              <img src={logo} alt="FoodBank Logo" className="h-12 w-auto" />
+            </Link>
           </div>
           <div className="hidden md:block flex-grow px-12">
             <div className="flex space-x-12">