diff --git a/src/components/global/icons/Magnifier.tsx b/src/components/global/icons/Magnifier.tsx
index 2999a74d..f3b50668 100644
--- a/src/components/global/icons/Magnifier.tsx
+++ b/src/components/global/icons/Magnifier.tsx
@@ -6,6 +6,7 @@ export const Magnifier: FillableIcon = ({ fill, size = 128, className }) => {
     <>
       <svg
         className={className}
+        // TODO: inline width and height don't support CSS units like 'rem' or 'em'
         width={size}
         height={size}
         viewBox="0 0 128 128"
diff --git a/src/components/ui/LineInput/index.tsx b/src/components/ui/LineInput/index.tsx
index e2983262..74f33a8c 100644
--- a/src/components/ui/LineInput/index.tsx
+++ b/src/components/ui/LineInput/index.tsx
@@ -28,11 +28,7 @@ type LineInputProps = {
 const IconField = React.memo(() => {
   return (
     <div className={$['magnifier-icon-wrapper']}>
-      <Magnifier
-        className={$['icon']}
-        fill={EodiroColors.primary}
-        size={'2rem'}
-      />
+      <Magnifier className={$['icon']} fill={EodiroColors.primary} />
     </div>
   )
 })