diff --git a/app/views/guide_form_elements.html b/app/views/guide_form_elements.html
index 5bcc66152..0d8b0b2cc 100755
--- a/app/views/guide_form_elements.html
+++ b/app/views/guide_form_elements.html
@@ -24,6 +24,7 @@ <h2 class="heading-small heading-contents">Contents:</h2>
         <li><a href="#form-optional-fields">Optional and mandatory fields</a></li>
         <li><a href="#form-labels">Labels</a></li>
         <li><a href="#form-fields">Form fields</a></li>
+        <li><a href="#form-textarea">Textarea</a></li>
         <li><a href="#form-focus-states">Form focus states</a></li>
         <li><a href="#form-hint-text">Hint text</a></li>
         <li><a href="#form-spacing">Spacing</a></li>
@@ -86,6 +87,25 @@ <h3 class="heading-medium" id="form-fields">Form fields</h3>
     </a>
   </p>
 
+  <h3 class="heading-medium" id="form-textarea">Textarea</h3>
+  <div class="text">
+    <p>
+      Make the height of a textarea proportional to the amount of text to be entered.
+    </p>
+  </div>
+
+  <div class="example">
+    {% include "snippets/form_textarea.html" %}
+  </div>
+
+<pre>
+<code class="language-markup">
+  {% filter escape %}
+    {% include "snippets/form_textarea.html" %}
+  {% endfilter %}
+</code>
+</pre>
+
   <h3 class="heading-medium" id="form-focus-states">Form focus states</h3>
   <div class="text">
     <p>
diff --git a/app/views/snippets/form_textarea.html b/app/views/snippets/form_textarea.html
new file mode 100644
index 000000000..b2ef7d96e
--- /dev/null
+++ b/app/views/snippets/form_textarea.html
@@ -0,0 +1,4 @@
+<label class="form-label" for="textarea">
+  Why can't you provide a National Insurance number?
+</label>
+<textarea class="form-control form-control-3-4" name="textarea" id="textarea" rows="5"></textarea>
diff --git a/assets/sass/elements/_forms.scss b/assets/sass/elements/_forms.scss
index e57e4dfc2..4e3dcaaac 100644
--- a/assets/sass/elements/_forms.scss
+++ b/assets/sass/elements/_forms.scss
@@ -163,11 +163,16 @@ textarea {
 // scss-lint:disable QualifyingElement
 input.form-control,
 textarea.form-control {
-  // Remove inner shadow
+  // Disable inner shadow and remove rounded corners
   -webkit-appearance: none;
-  // Remove rounded corners
   border-radius: 0;
 }
+
+textarea.form-control {
+  // Disable opacity and background image for Firefox
+  opacity: 1;
+  background-image: none;
+}
 // scss-lint:enable QualifyingElement