diff --git a/docs/4.0/material-design/forms.md b/docs/4.0/material-design/forms.md
index a86e8d2b..f88be665 100644
--- a/docs/4.0/material-design/forms.md
+++ b/docs/4.0/material-design/forms.md
@@ -43,6 +43,10 @@ Form controls flavored by Material Design for Bootstrap customizations such as `
       <option>5</option>
     </select>
   </div>
+  <div class="form-group">
+    <label for="exampleFormControlDateType1">Example date</label>
+    <input type="date" class="form-control" id="exampleFormControlDateType1">
+  </div>
   <div class="form-group">
     <label for="exampleTextarea" class="bmd-label-floating">Example textarea</label>
     <textarea class="form-control" id="exampleTextarea" rows="3"></textarea>
diff --git a/scss/_forms.scss b/scss/_forms.scss
index a8573a7d..40f4e26c 100644
--- a/scss/_forms.scss
+++ b/scss/_forms.scss
@@ -227,3 +227,18 @@ select {
     }
   }
 }
+
+// Fix input type data
+// Type text overwriting label-floating, making it's layout incorrect
+input[type="date"]::-webkit-datetime-edit {
+  color: transparent;
+}
+input[type="date"]:focus::-webkit-datetime-edit {
+  color: black !important;
+}
+.is-filled {
+  input[type="date"]::-webkit-datetime-edit {
+    color: black !important;
+  }
+}
+//-------------------------------------------------------------------