diff --git a/src/components/ImageInput/index.jsx b/src/components/ImageInput/index.jsx
new file mode 100644
index 0000000..385b2a9
--- /dev/null
+++ b/src/components/ImageInput/index.jsx
@@ -0,0 +1,19 @@
+import * as S from '../../styles/ImageInput.styles';
+
+function ImageInput({ id, multiple = false, onChange }) {
+  const htmlId = id ?? 'image-input';
+  return (
+    <S.ImageInput>
+      <S.ImageInputLabel htmlFor={htmlId}>파일 선택</S.ImageInputLabel>
+      <S.ImageInputField
+        id={htmlId}
+        type="file"
+        accept="image/jpg, image/png, image/jpeg"
+        multiple={multiple}
+        onChange={onChange}
+      />
+    </S.ImageInput>
+  );
+}
+
+export default ImageInput;
diff --git a/src/styles/ImageInput.styles.js b/src/styles/ImageInput.styles.js
new file mode 100644
index 0000000..2b0ca6b
--- /dev/null
+++ b/src/styles/ImageInput.styles.js
@@ -0,0 +1,19 @@
+import styled from 'styled-components';
+
+export const ImageInput = styled.div`
+  display: flex;
+  align-items: center;
+  gap: 20px;
+`;
+
+export const ImageInputLabel = styled.label`
+  ${({ theme }) => theme.boxShadow};
+  cursor: pointer;
+`;
+
+export const ImageInputField = styled.input`
+  cursor: pointer;
+  &::file-selector-button {
+    display: none;
+  }
+`;