diff --git a/web/packages/design/src/SVGIcon/Calendar.tsx b/web/packages/design/src/SVGIcon/Calendar.tsx
index f8f524cea88bd..b6ab0d308c785 100644
--- a/web/packages/design/src/SVGIcon/Calendar.tsx
+++ b/web/packages/design/src/SVGIcon/Calendar.tsx
@@ -48,7 +48,7 @@ export function Calendar({ size = 24, fill }: SVGIconProps) {
   return (
     <SVGIcon
       size={size}
-      color={fill}
+      fill={fill}
       className="icon icon-calendar"
       viewBox="0 0 24 24"
     >
diff --git a/web/packages/design/src/SVGIcon/ListMagnifyingGlass.tsx b/web/packages/design/src/SVGIcon/ListMagnifyingGlass.tsx
index 991a23e6ecc60..3976d8456f474 100644
--- a/web/packages/design/src/SVGIcon/ListMagnifyingGlass.tsx
+++ b/web/packages/design/src/SVGIcon/ListMagnifyingGlass.tsx
@@ -52,7 +52,7 @@ export function ListMagnifyingGlass({
   return (
     <SVGIcon
       size={size}
-      color={fill}
+      fill={fill}
       className="icon icon-listmagnifyingglass"
       viewBox="0 0 24 24"
       {...otherProps}
diff --git a/web/packages/design/src/SVGIcon/Notification.tsx b/web/packages/design/src/SVGIcon/Notification.tsx
index 881e0284b8e02..11d3f1fb4da6b 100644
--- a/web/packages/design/src/SVGIcon/Notification.tsx
+++ b/web/packages/design/src/SVGIcon/Notification.tsx
@@ -48,7 +48,7 @@ export function Notification({ size = 24, fill, ...otherProps }: SVGIconProps) {
   return (
     <SVGIcon
       size={size}
-      color={fill}
+      fill={fill}
       className="icon icon-notification"
       viewBox="0 0 24 24"
       {...otherProps}