diff --git a/node_modules/material-design-lite/src/slider/snippets/demo.html b/node_modules/material-design-lite/src/slider/snippets/demo.html
new file mode 100644
index 0000000..c7975d7
--- /dev/null
+++ b/node_modules/material-design-lite/src/slider/snippets/demo.html
@@ -0,0 +1,10 @@
+  <div class="demo-preview-block">
+    <p>
+      <input class="mdl-slider mdl-js-slider" type="range"
+        min="0" max="100" value="0" tabindex="0">
+    </p>
+    <p>
+      <input class="mdl-slider mdl-js-slider" type="range"
+        min="0" max="100" value="10" tabindex="0">
+    </p>
+  </div>
diff --git a/node_modules/material-design-lite/src/slider/snippets/slider-default-demo.html b/node_modules/material-design-lite/src/slider/snippets/slider-default-demo.html
new file mode 100644
index 0000000..53cce0e
--- /dev/null
+++ b/node_modules/material-design-lite/src/slider/snippets/slider-default-demo.html
@@ -0,0 +1,7 @@
+<style>
+  .demo-slider__slider-default .mdl-slider {
+    width: 30vw;
+    max-width: 260px;
+  }
+</style>
+{% include "slider-default.html" %}
diff --git a/node_modules/material-design-lite/src/slider/snippets/slider-default.html b/node_modules/material-design-lite/src/slider/snippets/slider-default.html
new file mode 100644
index 0000000..c0fd976
--- /dev/null
+++ b/node_modules/material-design-lite/src/slider/snippets/slider-default.html
@@ -0,0 +1,3 @@
+<!-- Default Slider -->
+<input class="mdl-slider mdl-js-slider" type="range"
+  min="0" max="100" value="0" tabindex="0">
diff --git a/node_modules/material-design-lite/src/slider/snippets/slider-starting-value-demo.html b/node_modules/material-design-lite/src/slider/snippets/slider-starting-value-demo.html
new file mode 100644
index 0000000..f3378c5
--- /dev/null
+++ b/node_modules/material-design-lite/src/slider/snippets/slider-starting-value-demo.html
@@ -0,0 +1,8 @@
+<style>
+  .demo-slider__slider-starting-value .mdl-slider {
+    width: 30vw;
+    max-width: 260px;
+  }
+</style>
+
+{% include "slider-starting-value.html" %}
diff --git a/node_modules/material-design-lite/src/slider/snippets/slider-starting-value.html b/node_modules/material-design-lite/src/slider/snippets/slider-starting-value.html
new file mode 100644
index 0000000..80f97b9
--- /dev/null
+++ b/node_modules/material-design-lite/src/slider/snippets/slider-starting-value.html
@@ -0,0 +1,3 @@
+<!-- Slider with Starting Value -->
+<input class="mdl-slider mdl-js-slider" type="range"
+  min="0" max="100" value="25" tabindex="0">