diff --git a/scss/_helpers.scss b/scss/_helpers.scss
index 13f2752c9bcc..898087f22b74 100644
--- a/scss/_helpers.scss
+++ b/scss/_helpers.scss
@@ -10,3 +10,4 @@
 @import "helpers/stretched-link";
 @import "helpers/text-truncation";
 @import "helpers/vr";
+@import "helpers/line-clamp";
diff --git a/scss/_mixins.scss b/scss/_mixins.scss
index e1e130b16438..c3de778a03b3 100644
--- a/scss/_mixins.scss
+++ b/scss/_mixins.scss
@@ -17,6 +17,7 @@
 @import "mixins/visually-hidden";
 @import "mixins/reset-text";
 @import "mixins/text-truncate";
+@import "mixins/line-clamp";
 
 // Utilities
 @import "mixins/utilities";
diff --git a/scss/helpers/_line-clamp.scss b/scss/helpers/_line-clamp.scss
new file mode 100644
index 000000000000..016f0811daa7
--- /dev/null
+++ b/scss/helpers/_line-clamp.scss
@@ -0,0 +1,9 @@
+//
+// Line clamp
+//
+
+@each $n in (1, 2, 3, 4, 5) {
+  .line-clamp-#{$n} {
+    @include line-clamp($n);
+  }
+}
diff --git a/scss/mixins/_line-clamp.scss b/scss/mixins/_line-clamp.scss
new file mode 100644
index 000000000000..022db551ab21
--- /dev/null
+++ b/scss/mixins/_line-clamp.scss
@@ -0,0 +1,7 @@
+// Line clamp
+@mixin line-clamp($lines: 2) {
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-line-clamp: $lines;
+  -webkit-box-orient: vertical;
+}