diff --git a/package/client/resource/interface/context.ts b/package/client/resource/interface/context.ts
index 64bb48e..897b312 100644
--- a/package/client/resource/interface/context.ts
+++ b/package/client/resource/interface/context.ts
@@ -6,7 +6,7 @@ interface ContextMenuItem {
   description?: string;
   arrow?: boolean;
   image?: string;
-  icon?: IconName | [IconPrefix, IconName];
+  icon?: IconName | [IconPrefix, IconName] | string;
   iconColor?: string;
   progress?: number;
   colorScheme?: string;
diff --git a/package/client/resource/interface/menu.ts b/package/client/resource/interface/menu.ts
index e0c0c35..2b22a62 100644
--- a/package/client/resource/interface/menu.ts
+++ b/package/client/resource/interface/menu.ts
@@ -5,7 +5,7 @@ type ChangeFunction = (selected: number, scrollIndex?: number, args?: any, check
 
 interface MenuOptions {
   label: string;
-  icon?: IconName | [IconPrefix, IconName];
+  icon?: IconName | [IconPrefix, IconName] | string;
   checked?: boolean;
   values?: Array<string | { label: string; description: string }>;
   description?: string;
diff --git a/web/src/features/menu/context/components/ContextButton.tsx b/web/src/features/menu/context/components/ContextButton.tsx
index 3dd25d6..64ddd72 100644
--- a/web/src/features/menu/context/components/ContextButton.tsx
+++ b/web/src/features/menu/context/components/ContextButton.tsx
@@ -3,6 +3,8 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import ReactMarkdown from 'react-markdown';
 import { Option, ContextMenuProps } from '../../../../typings';
 import { fetchNui } from '../../../../utils/fetchNui';
+import { isIconUrl } from '../../../../utils/isIconUrl';
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
 
 const openMenu = (id: string | undefined) => {
   fetchNui<ContextMenuProps>('openContext', { id: id, back: false });
@@ -21,6 +23,9 @@ const useStyles = createStyles((theme, params: { disabled?: boolean }) => ({
     color: params.disabled ? theme.colors.dark[3] : theme.colors.dark[0],
     whiteSpace: 'pre-wrap',
   },
+  iconImage: {
+    maxWidth: '25px',
+  },
   description: {
     color: params.disabled ? theme.colors.dark[3] : theme.colors.dark[2],
   },
@@ -63,7 +68,16 @@ const ContextButton: React.FC<{
                 <Group spacing={8} noWrap>
                   {button?.icon && (
                     <Stack w={25} h={25} justify="center" align="center">
-                      <FontAwesomeIcon icon={button.icon} fixedWidth size="lg" style={{ color: button.iconColor }} />
+                      {typeof button.icon === 'string' && isIconUrl(button.icon) ? (
+                        <img src={button.icon} className={classes.iconImage} alt="Missing img" />
+                      ) : (
+                        <FontAwesomeIcon
+                          icon={button.icon as IconProp}
+                          fixedWidth
+                          size="lg"
+                          style={{ color: button.iconColor }}
+                        />
+                      )}
                     </Stack>
                   )}
                   <Text sx={{ overflowWrap: 'break-word' }}>
diff --git a/web/src/features/menu/list/ListItem.tsx b/web/src/features/menu/list/ListItem.tsx
index 373630a..1730a0b 100644
--- a/web/src/features/menu/list/ListItem.tsx
+++ b/web/src/features/menu/list/ListItem.tsx
@@ -1,9 +1,11 @@
-import { Box, Group, Stack, Text, Progress } from '@mantine/core';
+import { Box, Group, Stack, Text, Progress, Image } from '@mantine/core';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import React, { forwardRef } from 'react';
 import CustomCheckbox from './CustomCheckbox';
 import type { MenuItem } from '../../../typings';
 import { createStyles } from '@mantine/core';
+import { isIconUrl } from '../../../utils/isIconUrl';
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
 
 interface Props {
   item: MenuItem;
@@ -24,6 +26,9 @@ const useStyles = createStyles((theme, params: { iconColor?: string }) => ({
       outline: 'none',
     },
   },
+  iconImage: {
+    maxWidth: 32,
+  },
   buttonWrapper: {
     paddingLeft: 5,
     paddingRight: 12,
@@ -32,6 +37,8 @@ const useStyles = createStyles((theme, params: { iconColor?: string }) => ({
   iconContainer: {
     display: 'flex',
     alignItems: 'center',
+    width: 32,
+    height: 32,
   },
   icon: {
     fontSize: 24,
@@ -79,7 +86,11 @@ const ListItem = forwardRef<Array<HTMLDivElement | null>, Props>(({ item, index,
       <Group spacing={15} noWrap className={classes.buttonWrapper}>
         {item.icon && (
           <Box className={classes.iconContainer}>
-            <FontAwesomeIcon icon={item.icon} className={classes.icon} fixedWidth />
+            {typeof item.icon === 'string' && isIconUrl(item.icon) ? (
+              <img src={item.icon} alt="Missing image" className={classes.iconImage} />
+            ) : (
+              <FontAwesomeIcon icon={item.icon as IconProp} className={classes.icon} fixedWidth />
+            )}
           </Box>
         )}
         {Array.isArray(item.values) ? (
diff --git a/web/src/typings/context.ts b/web/src/typings/context.ts
index aadec20..275581f 100644
--- a/web/src/typings/context.ts
+++ b/web/src/typings/context.ts
@@ -6,7 +6,7 @@ export interface Option {
   description?: string;
   arrow?: boolean;
   image?: string;
-  icon?: IconProp;
+  icon?: IconProp | string;
   iconColor?: string;
   progress?: number;
   colorScheme?: string;
diff --git a/web/src/typings/menu.ts b/web/src/typings/menu.ts
index c76f70e..802bd02 100644
--- a/web/src/typings/menu.ts
+++ b/web/src/typings/menu.ts
@@ -3,13 +3,14 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core';
 export type MenuPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
 
 export interface MenuItem {
+  image?: string;
   label: string;
   progress?: number;
   colorScheme?: string;
   checked?: boolean;
   values?: Array<string | { label: string; description: string }>;
   description?: string;
-  icon?: IconProp;
+  icon?: IconProp | string;
   iconColor?: string;
   defaultIndex?: number;
   close?: boolean;
diff --git a/web/src/utils/isIconUrl.ts b/web/src/utils/isIconUrl.ts
new file mode 100644
index 0000000..cc8c3d0
--- /dev/null
+++ b/web/src/utils/isIconUrl.ts
@@ -0,0 +1 @@
+export const isIconUrl = (icon: string) => icon.includes('://') || icon.includes('.png') || icon.includes('.webp');