diff --git a/src/components/basic/Icon/index.tsx b/src/components/basic/Icon/index.tsx
index 1eea6fe8..5ad40553 100644
--- a/src/components/basic/Icon/index.tsx
+++ b/src/components/basic/Icon/index.tsx
@@ -38,6 +38,7 @@ declare module '@mui/material/SvgIcon' {
 }
 export interface IconProps extends SvgIconProps {
   iconName: keyof typeof MUIIcons
+  onError?: () => void
 }
 
 // Use a switch case for scalable integration of additional icon libraries.
@@ -47,11 +48,22 @@ const getIconComponent = (iconName: string) => {
   ] as React.ComponentType<SvgIconProps>
 }
 
-export const Icon: React.FC<IconProps> = ({ iconName, ...props }) => {
+// defining default error handler
+const defaultOnError = (iconName: string) => {
+  console.warn(`Icon ${iconName} does not exist in @mui/icons-material`)
+}
+
+export const Icon: React.FC<IconProps> = ({
+  iconName,
+  onError = () => {
+    defaultOnError(iconName)
+  },
+  ...props
+}) => {
   const IconComponent = iconName ? getIconComponent(iconName) : null
 
   if (!IconComponent) {
-    console.warn(`Icon ${iconName} does not exist in @mui/icons-material`)
+    onError()
     return null
   }
 
diff --git a/src/components/basic/Image/index.tsx b/src/components/basic/Image/index.tsx
index 4ac7f346..58a48888 100644
--- a/src/components/basic/Image/index.tsx
+++ b/src/components/basic/Image/index.tsx
@@ -47,9 +47,16 @@ interface ImageProps {
   alt?: string
   style?: React.CSSProperties
   loader?: (src: string) => Promise<ArrayBuffer>
+  onError?: (e: Error) => void
 }
 
-export const Image = ({ src, alt, style, loader }: ImageProps): JSX.Element => {
+export const Image = ({
+  src,
+  alt,
+  style,
+  loader,
+  onError,
+}: ImageProps): JSX.Element => {
   const [data, setData] = useState(LogoGrayData)
   const [error, setError] = useState(false)
 
@@ -62,14 +69,14 @@ export const Image = ({ src, alt, style, loader }: ImageProps): JSX.Element => {
         IMAGE_TYPES[firstByte] ?? IMAGE_TYPES[first3Bytes] ?? 'image/*'
       setData(URL.createObjectURL(new Blob([buffer], { type: imageType })))
     } catch (e) {
+      // defining default error handler
+      onError ? onError(e as Error) : console.error(e)
       setData(LogoGrayData)
     }
   }, [src, loader])
 
   useEffect(() => {
-    getData().catch((e) => {
-      console.error(e)
-    })
+    void getData()
   }, [getData])
 
   return (