diff --git a/public/pic.jpg b/public/pic.jpg
new file mode 100644
index 0000000..332d4c6
Binary files /dev/null and b/public/pic.jpg differ
diff --git a/src/components/navbar.vue b/src/components/navbar.vue
index 4b58948..6a004da 100644
--- a/src/components/navbar.vue
+++ b/src/components/navbar.vue
@@ -86,10 +86,8 @@
 							Not yet i {{ selecteddata }}
 						</p>
 					</div>
-					<div
-						class="w-60 rounded-xl grayscale-25 h-45 bg-linear-to-r from-amber-500 to-blue-500"
-					>
-						Nothing
+					<div class="w-60 h-45 object-fill">
+						<img :src="pic" class="rounded-xl" alt="" />
 					</div>
 				</div>
 			</div>
@@ -97,6 +95,7 @@
 	</div>
 </template>
 <script setup>
+	import pic from "/public/pic.jpg";
 	import { nextTick, ref } from "vue";
 	const selecteddata = ref("Product");
 	const hoverd = ref(false);