diff --git a/src/components/atoms/Avatar/Avatar.stories.tsx b/src/components/atoms/Avatar/Avatar.stories.tsx
new file mode 100644
index 000000000..721296a71
--- /dev/null
+++ b/src/components/atoms/Avatar/Avatar.stories.tsx
@@ -0,0 +1,11 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { withKnobs, text } from '@storybook/addon-knobs';
+import Avatar from './Avatar';
+import Faker from 'faker';
+
+const defaultAvatar = Faker.image.avatar();
+
+storiesOf('atoms/Avatar', module)
+  .addDecorator(withKnobs)
+  .add('normal', () => <Avatar src={text('content', defaultAvatar)} />);
diff --git a/src/components/atoms/Avatar/Avatar.ts b/src/components/atoms/Avatar/Avatar.ts
new file mode 100644
index 000000000..e15cf753a
--- /dev/null
+++ b/src/components/atoms/Avatar/Avatar.ts
@@ -0,0 +1,9 @@
+import styled from 'styled-components';
+
+export default styled.img`
+  display: block
+  width: 89px;
+  height: 89px;
+  background-color: ${props => props.theme.contributorGrey};
+  border-radius: 50%;
+`;