diff --git a/src/components/atoms/Image/Image.stories.tsx b/src/components/atoms/Image/Image.stories.tsx
new file mode 100644
index 0000000..5e6f491
--- /dev/null
+++ b/src/components/atoms/Image/Image.stories.tsx
@@ -0,0 +1,15 @@
+import React from 'react'
+
+import { ComponentStory, ComponentMeta } from '@storybook/react'
+
+import { Image, ImageProps } from './Image'
+
+export default {
+  title: 'atoms/Image',
+  component: Image
+} as ComponentMeta<React.ComponentType<ImageProps>>
+
+const Template: ComponentStory<React.ComponentType<ImageProps>> = args => <Image {...args} />
+
+export const Primary = Template.bind({})
+Primary.args = {}
diff --git a/src/components/atoms/Image/Image.tsx b/src/components/atoms/Image/Image.tsx
new file mode 100644
index 0000000..768f17b
--- /dev/null
+++ b/src/components/atoms/Image/Image.tsx
@@ -0,0 +1,14 @@
+import React from 'react'
+
+export type ImageProps = {
+  src?: string
+  width?: string | number
+  height?: string | number
+  className?: string
+  alt?: string
+  onClick?: () => void
+}
+
+export const Image = ({ src, className, alt, height, width, onClick }: ImageProps) => {
+  return <img className={className} onClick={onClick} alt={alt} src={src} width={width} height={height} />
+}
diff --git a/src/components/atoms/Image/index.ts b/src/components/atoms/Image/index.ts
new file mode 100644
index 0000000..072b161
--- /dev/null
+++ b/src/components/atoms/Image/index.ts
@@ -0,0 +1 @@
+export * from './Image'
diff --git a/src/components/index.ts b/src/components/index.ts
index be18392..313da19 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -1,3 +1,4 @@
 import { LoginButton } from './atoms/LoginButton'
+import { Image } from './atoms/Image'
 
-export default { LoginButton }
+export default { LoginButton, Image }