diff --git a/docs/en/form.md b/docs/en/form.md
index a014357..1367277 100644
--- a/docs/en/form.md
+++ b/docs/en/form.md
@@ -100,3 +100,6 @@ $component-form-text-with-button-properties: (
 ## Form Process Animation
 When a form is submitted all fields are disabled including the submit button. An animated icon is added next to the submit button as well.
 You must opt-in for this to take effect, the form element must contain the following class: `fw-form-process-event` as well as the `fw-form` class.
+
+## Label placements
+By default, labels are placed inside the input box. To change this, simply add the `fw-form-label-above` class alongside the `fw-form` class. This adjustment moves labels above the fields, eliminating any animation when a field gains or loses focus.
diff --git a/package.json b/package.json
index 63ef59b..b22afe4 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "werkbot-framewerk",
-  "version": "2.1.17",
+  "version": "2.2.0",
   "description": "A framework of css and javascript that Werkbot uses as a foundation to build our websites.",
   "main": "js/form.js",
   "directories": {
diff --git a/sass/components/form/_form.scss b/sass/components/form/_form.scss
index 77de882..8e5f350 100644
--- a/sass/components/form/_form.scss
+++ b/sass/components/form/_form.scss
@@ -10,7 +10,8 @@ $default-component-form-properties:(
   validationSuccessTextColor: #000000,
   validationSuccessBackgroundColor: #00cc00,
   validationWarningTextColor: #000000,
-  validationWarningBackgroundColor: #ffcc00
+  validationWarningBackgroundColor: #ffcc00,
+  labelAboveMargin: 0,
 );
 // If $component-form-checkbox-properties is set, lets merge into our defaults
 $component-form-properties: $default-component-form-properties !default;
diff --git a/sass/components/form/components/_numeric.scss b/sass/components/form/components/_numeric.scss
index 7ffa8a0..058ec19 100644
--- a/sass/components/form/components/_numeric.scss
+++ b/sass/components/form/components/_numeric.scss
@@ -93,4 +93,13 @@ $component-form-numeric-properties: $default-component-form-numeric-properties !
       }
     }
   }
+
+  // Label above field
+  &.fw-form-label-above{
+    .field.numeric{
+      input, input[type='number']{
+        padding: 9px 50px;
+      }
+    }
+  }
 }
diff --git a/sass/components/form/components/_select.scss b/sass/components/form/components/_select.scss
index ca181ea..18f3bdf 100644
--- a/sass/components/form/components/_select.scss
+++ b/sass/components/form/components/_select.scss
@@ -73,6 +73,25 @@ $component-form-select-properties: $default-component-form-select-properties !de
       pointer-events: none;
     }
   }
+
+  // Label above field
+  &.fw-form-label-above{
+    .field.dropdown{
+      label{
+        position: relative;
+        transform: none;
+        margin: getThemeProperty(labelAboveMargin, $component-form-properties);
+        &.labelShrunk{
+          transform: none;
+        }
+      }
+      select{
+        &.labelShrunk{
+          padding: 20px;
+        }
+      }
+    }
+  }
 }
 @-moz-document url-prefix() {
   .fw-form{
diff --git a/sass/components/form/components/_text-with-button.scss b/sass/components/form/components/_text-with-button.scss
index 1d359e3..2cb0930 100644
--- a/sass/components/form/components/_text-with-button.scss
+++ b/sass/components/form/components/_text-with-button.scss
@@ -101,6 +101,25 @@ $component-form-text-with-button-properties: $default-component-form-text-with-b
         border-radius: getThemeProperty(buttonBorderRadius, $component-form-text-with-button-properties);
       }
     }
+  }
 
+  // Label above field
+  &.fw-form-label-above{
+    .field.text-with-button{
+      label{
+        position: relative;
+        transform: none;
+        margin: getThemeProperty(labelAboveMargin, $component-form-properties);
+        &.labelShrunk{
+          transform: none;
+        }
+      }
+      input{
+        padding: 20px;
+        &.labelShrunk{
+          padding: 20px;
+        }
+      }
+    }
   }
 }
diff --git a/sass/components/form/components/_text.scss b/sass/components/form/components/_text.scss
index 078dabd..64b8768 100644
--- a/sass/components/form/components/_text.scss
+++ b/sass/components/form/components/_text.scss
@@ -51,4 +51,24 @@ $component-form-text-properties: $default-component-form-text-properties !defaul
       }
     }
   }
+
+  // Label above field
+  &.fw-form-label-above{
+    .field.text{
+      label{
+        position: relative;
+        transform: none;
+        margin: getThemeProperty(labelAboveMargin, $component-form-properties);
+        &.labelShrunk{
+          transform: none;
+        }
+      }
+      input{
+        padding: 20px;
+        &.labelShrunk{
+          padding: 20px;
+        }
+      }
+    }
+  }
 }
diff --git a/sass/components/form/components/_textarea.scss b/sass/components/form/components/_textarea.scss
index 89bb104..d442267 100644
--- a/sass/components/form/components/_textarea.scss
+++ b/sass/components/form/components/_textarea.scss
@@ -51,4 +51,24 @@ $component-form-textarea-properties: $default-component-form-textarea-properties
       }
     }
   }
+
+  // Label above field
+  &.fw-form-label-above{
+    .field.textarea{
+      label{
+        position: relative;
+        transform: none;
+        margin: getThemeProperty(labelAboveMargin, $component-form-properties);
+        &.labelShrunk{
+          transform: none;
+        }
+      }
+      textarea{
+        padding: 20px;
+        &.labelShrunk{
+          padding: 20px;
+        }
+      }
+    }
+  }
 }