diff --git a/src/atoms/Flex.js b/src/atoms/Flex.js
new file mode 100644
index 0000000..4701b48
--- /dev/null
+++ b/src/atoms/Flex.js
@@ -0,0 +1,12 @@
+import React from "react";
+import Div from "./div";
+
+const Flex = ({ col, children, ...rest }) => {
+  return (
+    <Div d="flex" flexDir={col ? "column" : "row"} {...rest}>
+      {children}
+    </Div>
+  );
+};
+
+export default Flex;
diff --git a/src/index.js b/src/index.js
index 1cc72f8..36fd31d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -17,6 +17,7 @@ export { default as Image } from "./atoms/image/Image";
 export { default as Tag } from "./atoms/tag/Tag";
 export { default as Anchor } from "./atoms/anchor/Anchor";
 export { default as Collapse } from "./atoms/collapse/Collapse";
+export { default as Flex } from "./atoms/Flex";
 export { default as Modal } from "./atoms/modal/Modal";
 export { default as SideDrawer } from "./atoms/sidedrawer/SideDrawer";
 export { default as Notification } from "./atoms/notification/Notification";