diff --git a/.gitignore b/.gitignore
index f452efe..4c69b60 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,3 +23,4 @@ package-lock.json
 /.node_modules.ember-try/
 /bower.json.ember-try
 /package.json.ember-try
+.idea
diff --git a/addon/components/s-horizontal-menu-item.js b/addon/components/s-horizontal-menu-item.js
new file mode 100644
index 0000000..0958628
--- /dev/null
+++ b/addon/components/s-horizontal-menu-item.js
@@ -0,0 +1,11 @@
+import Component from '@ember/component';
+
+export default Component.extend({
+  actions: {
+    doAction(){
+      if (this.get('applyAction')) {
+        this.get('applyAction')(this.action, this.pipelineId);
+      }
+    }
+  }
+});
diff --git a/addon/components/s-horizontal-menu.js b/addon/components/s-horizontal-menu.js
new file mode 100644
index 0000000..72c20e1
--- /dev/null
+++ b/addon/components/s-horizontal-menu.js
@@ -0,0 +1,5 @@
+import Component from '@ember/component';
+
+export default Component.extend({
+})
+
diff --git a/addon/styles/components/_s-horizontal-menu-item.scss b/addon/styles/components/_s-horizontal-menu-item.scss
new file mode 100644
index 0000000..8621a24
--- /dev/null
+++ b/addon/styles/components/_s-horizontal-menu-item.scss
@@ -0,0 +1,6 @@
+.horizontal-dropdown-item{
+  color: $themeTitlePrimaryColor;
+}
+li:hover{
+  background: $themeHoverColor;
+}
diff --git a/addon/styles/components/_s-horizontal-menu.scss b/addon/styles/components/_s-horizontal-menu.scss
new file mode 100644
index 0000000..61b8ad4
--- /dev/null
+++ b/addon/styles/components/_s-horizontal-menu.scss
@@ -0,0 +1,21 @@
+.pointed-dropdown::before {
+  position: absolute;
+  top: -7px;
+  left: 11px;
+  display: inline-block;
+  border-right: 7px solid transparent;
+  border-bottom: 7px solid $themeFifthGrey;
+  border-left: 7px solid transparent;
+  border-bottom-color: $themeFifthGrey;
+  content: '';
+}
+.pointed-dropdown::after {
+  position: absolute;
+  top: -6px;
+  left: 10px;
+  display: inline-block;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid white;
+  border-left: 6px solid transparent;
+  content: '';
+}
diff --git a/addon/templates/components/s-horizontal-menu-item.hbs b/addon/templates/components/s-horizontal-menu-item.hbs
new file mode 100644
index 0000000..a007046
--- /dev/null
+++ b/addon/templates/components/s-horizontal-menu-item.hbs
@@ -0,0 +1 @@
+<li class="horizontal-dropdown-item pt5 pl30 pb5 pr8" {{action "doAction"}}>{{title}}</li>
\ No newline at end of file
diff --git a/addon/templates/components/s-horizontal-menu.hbs b/addon/templates/components/s-horizontal-menu.hbs
new file mode 100644
index 0000000..918b3e1
--- /dev/null
+++ b/addon/templates/components/s-horizontal-menu.hbs
@@ -0,0 +1,5 @@
+<ul class ="q-card-dropdown-menu dropdown-menu pointed-dropdown">
+  {{yield (hash
+            menu=(component "q-horizontal-menu-item" title=title))
+  }}
+</ul>
\ No newline at end of file
diff --git a/app/components/s-horizontal-menu-item.js b/app/components/s-horizontal-menu-item.js
new file mode 100644
index 0000000..21a71e4
--- /dev/null
+++ b/app/components/s-horizontal-menu-item.js
@@ -0,0 +1 @@
+export { default } from 'space-ui/components/s-horizontal-menu-item';
diff --git a/app/components/s-horizontal-menu.js b/app/components/s-horizontal-menu.js
new file mode 100644
index 0000000..ffe7d42
--- /dev/null
+++ b/app/components/s-horizontal-menu.js
@@ -0,0 +1 @@
+export { default } from 'space-ui/components/s-horizontal-menu';
diff --git a/tests/dummy/app/templates/docs/horizontal-menu.md b/tests/dummy/app/templates/docs/horizontal-menu.md
new file mode 100644
index 0000000..0c9210f
--- /dev/null
+++ b/tests/dummy/app/templates/docs/horizontal-menu.md
@@ -0,0 +1,25 @@
+# Horizontal menu
+
+<p>To create a dropdown menu.</p>
+
+{{#docs-demo as |demo|}}
+{{#demo.example name='demo-horizontal-menu-basic.hbs'}}
+
+
+{{#s-horizontal-menu as |m|
+    {{m.menu title="title" applyAction=(action "onMenuClick")
+     action=(action "itemAction") pipelineId=pipelineId}}
+{{/s-horizontal-menu}}
+
+{{/demo.example}}
+
+{{demo.snippet 'demo-horizontal-menu-basic.hbs'}}
+{{/docs-demo}}
+
+| Property   | Description                                                                  | Type    | Default |
+| ---------- | ---------------------------------------------------------------------------- | ------- | ------- |
+| title      | Name of the menu item                                                        | string  | ""  |
+| action  | Action to be performed on clicking an item from the menu                        | String  | ""    |
+| pipelineID  | Id of the unique identifier                                                 | String  | "" |
+| applyAction   | Generic action that will call the "action provided"                       | string | ""   |
+