diff --git a/frontend/src/library/input.module.css b/frontend/src/library/input.module.css
deleted file mode 100644
index d5e3426..0000000
--- a/frontend/src/library/input.module.css
+++ /dev/null
@@ -1 +0,0 @@
-/* rules defined in this file are scoped to the js/ts file importing this.  */
diff --git a/frontend/src/library/input.tsx b/frontend/src/library/input.tsx
index 1455ab5..4f79b9d 100644
--- a/frontend/src/library/input.tsx
+++ b/frontend/src/library/input.tsx
@@ -1,15 +1,24 @@
-import styles from './input.module.css';
+import React from 'react';
 
-type InputComponentProps = {
-    placeholder?: string;
+type Props = React.DetailedHTMLProps<
+    React.InputHTMLAttributes<HTMLInputElement>,
+    HTMLInputElement
+> & {
+    width?: string;
+    height?: string;
 };
 
-function Input({ placeholder }: InputComponentProps) {
+const Input: React.FC<Props> = ({
+    width = '392px',
+    height = '44px',
+    ...props
+}) => {
     return (
-        <div>
-            <input style={styles} placeholder={placeholder}></input>
-        </div>
+        <input
+            className={`w-[${width}] h-[${height}] bg-[#d9d9d9] border-4 border-black rounded-[20px] flex items-center justify-center text-center p-0 font-normal font-kavoon text-[23.2px] leading-[29px] text-black placeholder-white placeholder-opacity-50"`}
+            {...props}
+        />
     );
-}
+};
 
 export default Input;