diff --git a/app/partials/includes/modules/common/custom-fields.jade b/app/partials/includes/modules/common/custom-fields.jade
new file mode 100644
index 00000000..cf2be606
--- /dev/null
+++ b/app/partials/includes/modules/common/custom-fields.jade
@@ -0,0 +1,21 @@
+section.duty-custom-fields
+    div.custom-fields-header
+        span Custom Fields
+        // Remove .open class on click on this button in both .icon and .custom-fields-body to close
+        a.icon.icon-arrow-bottom.open
+    div.custom-fields-body.open
+        div.custom-field-single
+            div.custom-field-data
+                span.custom-field-name Name
+                span.custom-field-description This is the description
+            div.custom-field-value
+                span Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec.
+            div.custom-field-options
+                a.icon.icon-edit(href="", title="Edit Custom Field")
+        form.custom-field-single
+            div.custom-field-data
+                label.custom-field-name(for="custom-field-description") Name
+            div.custom-field-value
+                input#custom-field-description(type="text", placeholder="This is the description")
+            div.custom-field-options
+                a.icon.icon-floppy(href="", title="Save Custom Field")
diff --git a/app/partials/us/us-detail.jade b/app/partials/us/us-detail.jade
index 5a78e15c..3c21553c 100644
--- a/app/partials/us/us-detail.jade
+++ b/app/partials/us/us-detail.jade
@@ -39,6 +39,9 @@ div.wrapper(ng-controller="UserStoryDetailController as ctrl",
 
         section.duty-content(tg-editable-description, ng-model="us", required-perm="modify_us")
 
+        // IF Custom Fields
+        include ../includes/modules/common/custom-fields
+
         include ../includes/modules/related-tasks
 
         tg-attachments(ng-model="us", type="us")
diff --git a/app/styles/modules/common/custom-fields.scss b/app/styles/modules/common/custom-fields.scss
new file mode 100644
index 00000000..01105689
--- /dev/null
+++ b/app/styles/modules/common/custom-fields.scss
@@ -0,0 +1,76 @@
+.duty-custom-fields {
+    margin-bottom: 2rem;
+    .custom-fields-header {
+        @extend %bold;
+        align-content: space-between;
+        align-items: center;
+        background: $whitish;
+        display: flex;
+        justify-content: space-between;
+        padding: .5rem 1rem;
+        .icon-arrow-bottom {
+            @extend %large;
+            cursor: pointer;
+            transform: rotate(-90deg);
+            transition: transform .2s linear;
+            &.open {
+                transform: rotate(0);
+                transition: transform .2s linear;
+            }
+        }
+    }
+    .custom-fields-body {
+        @include slide(1000px, hidden, $min: 0);
+    }
+    .custom-field-single {
+        align-content: center;
+        align-items: center;
+        border-bottom: 1px solid $whitish;
+        display: flex;
+        padding: 1rem;
+        &:last-child {
+            border-bottom: 0;
+        }
+        &:hover {
+            .custom-field-options {
+                opacity: 1;
+            }
+        }
+        .custom-field-options {
+            opacity: 0;
+            transition: opacity .2s linear;
+            a {
+                color: $gray-light;
+            }
+            a:hover {
+                color: $green-taiga;
+            }
+        }
+    }
+    .custom-field-data {
+        flex: 0;
+        flex-basis: 200px;
+        .custom-field-name {
+            @extend %bold;
+            display: block;
+        }
+        .custom-field-description {
+            @extend %small;
+            color: $gray-light;
+            display: block;
+            line-height: .9rem;
+        }
+    }
+    .custom-field-value {
+        flex: 1;
+        padding-right: 2rem;
+    }
+    form {
+        label {
+            cursor: pointer;
+        }
+        input {
+            width: 100%;
+        }
+    }
+}
diff --git a/main-sass.js b/main-sass.js
index 909931e1..f729d1e6 100644
--- a/main-sass.js
+++ b/main-sass.js
@@ -75,6 +75,7 @@ exports.files = function () {
         'modules/common/history',
         'modules/common/wizard',
         'modules/common/external-reference',
+        'modules/common/custom-fields',
 
         //Project modules
         'modules/home-projects-list',