diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css
index db07aa37d209..9f52e8003ce3 100644
--- a/__tests__/fixtures/tailwind-output.css
+++ b/__tests__/fixtures/tailwind-output.css
@@ -4791,6 +4791,30 @@ table {
   box-shadow: none;
 }
 
+.snap-x {
+  scroll-snap-type: x mandatory;
+}
+
+.snap-y {
+  scroll-snap-type: y mandatory;
+}
+
+.snap-xy {
+  scroll-snap-type: both mandatory;
+}
+
+.snap-start {
+  scroll-snap-align: start;
+}
+
+.snap-end {
+  scroll-snap-align: end;
+}
+
+.snap-center {
+  scroll-snap-align: center;
+}
+
 .fill-current {
   fill: currentColor;
 }
@@ -10368,6 +10392,30 @@ table {
     box-shadow: none;
   }
 
+  .sm\:snap-x {
+    scroll-snap-type: x mandatory;
+  }
+
+  .sm\:snap-y {
+    scroll-snap-type: y mandatory;
+  }
+
+  .sm\:snap-xy {
+    scroll-snap-type: both mandatory;
+  }
+
+  .sm\:snap-start {
+    scroll-snap-align: start;
+  }
+
+  .sm\:snap-end {
+    scroll-snap-align: end;
+  }
+
+  .sm\:snap-center {
+    scroll-snap-align: center;
+  }
+
   .sm\:table-auto {
     table-layout: auto;
   }
@@ -15938,6 +15986,30 @@ table {
     box-shadow: none;
   }
 
+  .md\:snap-x {
+    scroll-snap-type: x mandatory;
+  }
+
+  .md\:snap-y {
+    scroll-snap-type: y mandatory;
+  }
+
+  .md\:snap-xy {
+    scroll-snap-type: both mandatory;
+  }
+
+  .md\:snap-start {
+    scroll-snap-align: start;
+  }
+
+  .md\:snap-end {
+    scroll-snap-align: end;
+  }
+
+  .md\:snap-center {
+    scroll-snap-align: center;
+  }
+
   .md\:table-auto {
     table-layout: auto;
   }
@@ -21508,6 +21580,30 @@ table {
     box-shadow: none;
   }
 
+  .lg\:snap-x {
+    scroll-snap-type: x mandatory;
+  }
+
+  .lg\:snap-y {
+    scroll-snap-type: y mandatory;
+  }
+
+  .lg\:snap-xy {
+    scroll-snap-type: both mandatory;
+  }
+
+  .lg\:snap-start {
+    scroll-snap-align: start;
+  }
+
+  .lg\:snap-end {
+    scroll-snap-align: end;
+  }
+
+  .lg\:snap-center {
+    scroll-snap-align: center;
+  }
+
   .lg\:table-auto {
     table-layout: auto;
   }
@@ -27078,6 +27174,30 @@ table {
     box-shadow: none;
   }
 
+  .xl\:snap-x {
+    scroll-snap-type: x mandatory;
+  }
+
+  .xl\:snap-y {
+    scroll-snap-type: y mandatory;
+  }
+
+  .xl\:snap-xy {
+    scroll-snap-type: both mandatory;
+  }
+
+  .xl\:snap-start {
+    scroll-snap-align: start;
+  }
+
+  .xl\:snap-end {
+    scroll-snap-align: end;
+  }
+
+  .xl\:snap-center {
+    scroll-snap-align: center;
+  }
+
   .xl\:table-auto {
     table-layout: auto;
   }
diff --git a/defaultConfig.stub.js b/defaultConfig.stub.js
index d7d0a612d397..3702f711a7c6 100644
--- a/defaultConfig.stub.js
+++ b/defaultConfig.stub.js
@@ -895,6 +895,7 @@ module.exports = {
     position: ['responsive'],
     resize: ['responsive'],
     shadows: ['responsive', 'hover', 'focus'],
+    snap: ['responsive'],
     svgFill: [],
     svgStroke: [],
     tableLayout: ['responsive'],
diff --git a/src/generators/snap.js b/src/generators/snap.js
new file mode 100644
index 000000000000..5f2a902415a1
--- /dev/null
+++ b/src/generators/snap.js
@@ -0,0 +1,12 @@
+import defineClasses from '../util/defineClasses'
+
+export default function() {
+  return defineClasses({
+    'snap-x': { 'scroll-snap-type': 'x mandatory' },
+    'snap-y': { 'scroll-snap-type': 'y mandatory' },
+    'snap-xy': { 'scroll-snap-type': 'both mandatory' },
+    'snap-start': { 'scroll-snap-align': 'start' },
+    'snap-end': { 'scroll-snap-align': 'end' },
+    'snap-center': { 'scroll-snap-align': 'center' },
+  })
+}
diff --git a/src/utilityModules.js b/src/utilityModules.js
index fd5aa154a5b8..9d3abf740f06 100644
--- a/src/utilityModules.js
+++ b/src/utilityModules.js
@@ -32,6 +32,7 @@ import pointerEvents from './generators/pointerEvents'
 import position from './generators/position'
 import resize from './generators/resize'
 import shadows from './generators/shadows'
+import snap from './generators/snap'
 import svgFill from './generators/svgFill'
 import svgStroke from './generators/svgStroke'
 import tableLayout from './generators/tableLayout'
@@ -82,6 +83,7 @@ export default [
   { name: 'position', generator: position },
   { name: 'resize', generator: resize },
   { name: 'shadows', generator: shadows },
+  { name: 'snap', generator: snap },
   { name: 'svgFill', generator: svgFill },
   { name: 'svgStroke', generator: svgStroke },
   { name: 'tableLayout', generator: tableLayout },