diff --git a/src/IconButton.js b/src/IconButton.js
new file mode 100644
index 0000000..a34639b
--- /dev/null
+++ b/src/IconButton.js
@@ -0,0 +1,27 @@
+import React, {forwardRef} from 'react';
+import styled from "styled-components";
+import Button from "./Button";
+import Text from "./Text";
+import {
+    BlendIcon,
+} from "@blend-ui/icons";
+
+const ClickableIcon = styled(BlendIcon).attrs(props => ({
+    color: props.theme.colors.black,
+}))`
+  pointer-events: none;
+`;
+
+const IconButton = forwardRef(( props, ref) => {
+    const { iconify, buttonText, ...rest } = props;
+    return (
+        <Button flexDirection="column">
+            <Text>{buttonText}</Text>
+            <ClickableIcon {...props} iconify = {iconify}/>
+        </Button>
+    );
+});
+
+IconButton.displayName = "IconButton";
+
+export default IconButton;
diff --git a/src/InputBar.js b/src/InputBar.js
new file mode 100644
index 0000000..7c558be
--- /dev/null
+++ b/src/InputBar.js
@@ -0,0 +1,59 @@
+import React from "react";
+import styled from "styled-components";
+
+import { default as styledProps } from "@styled-system/prop-types";
+import {
+    background,
+    border,
+    color,
+    flexbox,
+    layout,
+    space,
+    typography,
+    compose,
+} from "styled-system";
+
+
+const systemProps = compose(
+    layout,
+    color,
+    space,
+    background,
+    border,
+    typography,
+    flexbox,
+);
+
+const InputComponent = styled.input`
+    ${systemProps};
+`;
+
+const Input = props  => {
+    const { ...other } = props;
+    return <InputComponent {...other}/>;
+}
+
+Input.defaultProps = {
+    color: "currentColor",
+};
+
+Input.defaultProps = {
+    width: "420px",
+    height: "46px",
+    border: "1px solid #1E1D1D",
+    borderRadius: "2px",
+    textAlign: "left",
+};
+
+
+Input.propTypes = {
+    ...styledProps.space,
+    ...styledProps.color,
+    ...styledProps.layout,
+    ...styledProps.background,
+    ...styledProps.border,
+    ...styledProps.typography,
+    ...styledProps.flexbox,
+};
+
+export default Input;
\ No newline at end of file
diff --git a/stories/IconButton.stories.js b/stories/IconButton.stories.js
new file mode 100644
index 0000000..e4b562b
--- /dev/null
+++ b/stories/IconButton.stories.js
@@ -0,0 +1,13 @@
+import React from "react";
+import IconButton from "../src/IconButton";
+import {tableCogIcon} from "@blend-ui/icons";
+
+
+export default { title: "IconButton" };
+export const iconButton = () => (
+    <IconButton iconify={tableCogIcon} buttonText={"iconButton"} />
+);
+
+iconButton.story = {
+    name: "IconButton",
+};
diff --git a/stories/InputBar.stories.js b/stories/InputBar.stories.js
new file mode 100644
index 0000000..727dda3
--- /dev/null
+++ b/stories/InputBar.stories.js
@@ -0,0 +1,15 @@
+import React from "react";
+import Input from "../src/InputBar";
+export default { title: "Input" };
+
+export const input = () => (
+    <div>
+        <Input bg={"#FFFFFF"} borderColor={"#D1D6DB"} placeholder={"Password"}/>
+    </div>
+
+
+);
+
+input.story = {
+    name: "Input Component",
+};
\ No newline at end of file