diff --git a/web/src/features/menu/ContextMenu.tsx b/web/src/features/menu/ContextMenu.tsx
index 94220ca..e3d639b 100644
--- a/web/src/features/menu/ContextMenu.tsx
+++ b/web/src/features/menu/ContextMenu.tsx
@@ -17,6 +17,7 @@ debugData<ContextMenuProps>([
         {
           title: "Example button",
           description: "Example button description",
+          image: "https://i.imgur.com/YAe7k17.jpeg",
           metadata: [{ label: "Value 1", value: 300 }],
         },
         {
diff --git a/web/src/features/menu/Item.tsx b/web/src/features/menu/Item.tsx
index 51179f7..5aeff1b 100644
--- a/web/src/features/menu/Item.tsx
+++ b/web/src/features/menu/Item.tsx
@@ -8,6 +8,7 @@ import {
   Text,
   Flex,
   Spacer,
+  Image,
 } from "@chakra-ui/react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Option, ContextMenuProps } from "../../interfaces/context";
@@ -91,31 +92,34 @@ const Item: React.FC<{
                   maxW="2xs"
                 >
                   <PopoverBody>
-                    {Array.isArray(option[1].metadata) ? (
-                      option[1].metadata.map(
-                        (
-                          metadata: string | { label: string; value: any },
-                          index: number
-                        ) => (
-                          <Text key={`context-metadata-${index}`}>
-                            {typeof metadata === "string"
-                              ? `${metadata}`
-                              : `${metadata.label}: ${metadata.value}`}
-                          </Text>
+                    <>
+                      {option[1].image && <Image src={option[1].image} />}
+                      {Array.isArray(option[1].metadata) ? (
+                        option[1].metadata.map(
+                          (
+                            metadata: string | { label: string; value: any },
+                            index: number
+                          ) => (
+                            <Text key={`context-metadata-${index}`}>
+                              {typeof metadata === "string"
+                                ? `${metadata}`
+                                : `${metadata.label}: ${metadata.value}`}
+                            </Text>
+                          )
                         )
-                      )
-                    ) : (
-                      <>
-                        {typeof option[1].metadata === "object" &&
-                          Object.entries(option[1].metadata).map(
-                            (metadata: { [key: string]: any }, index) => (
-                              <Text key={`context-metadata-${index}`}>
-                                {metadata[0]}: {metadata[1]}
-                              </Text>
-                            )
-                          )}
-                      </>
-                    )}
+                      ) : (
+                        <>
+                          {typeof option[1].metadata === "object" &&
+                            Object.entries(option[1].metadata).map(
+                              (metadata: { [key: string]: any }, index) => (
+                                <Text key={`context-metadata-${index}`}>
+                                  {metadata[0]}: {metadata[1]}
+                                </Text>
+                              )
+                            )}
+                        </>
+                      )}
+                    </>
                   </PopoverBody>
                 </PopoverContent>
               )}
diff --git a/web/src/interfaces/context.ts b/web/src/interfaces/context.ts
index b5347b8..9636f58 100644
--- a/web/src/interfaces/context.ts
+++ b/web/src/interfaces/context.ts
@@ -3,6 +3,7 @@ export interface Option {
   title?: string;
   description?: string;
   arrow?: boolean;
+  image?: string;
   metadata?:
     | string[]
     | { [key: string]: any }