diff --git a/scss/_helpers.scss b/scss/_helpers.scss
index 8f566d12f8..13fb1bbb5d 100644
--- a/scss/_helpers.scss
+++ b/scss/_helpers.scss
@@ -2,6 +2,7 @@
@import "helpers/colored-links";
@import "helpers/ratio";
@import "helpers/position";
+@import "helpers/stacks";
@import "helpers/visually-hidden";
@import "helpers/stretched-link";
@import "helpers/text-truncation";
diff --git a/scss/helpers/_stacks.scss b/scss/helpers/_stacks.scss
new file mode 100644
index 0000000000..bb0d4d55a8
--- /dev/null
+++ b/scss/helpers/_stacks.scss
@@ -0,0 +1,24 @@
+// scss-docs-start stacks
+.hstack {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ align-self: stretch;
+}
+
+.vstack {
+ display: flex;
+ flex: 1 1 auto;
+ flex-direction: column;
+ align-self: stretch;
+}
+// scss-docs-end stacks
+
+.vr {
+ display: inline-block;
+ align-self: stretch;
+ width: 1px;
+ min-height: 1em;
+ background-color: currentColor;
+ opacity: $hr-opacity;
+}
diff --git a/site/content/docs/5.0/helpers/stacks.md b/site/content/docs/5.0/helpers/stacks.md
new file mode 100644
index 0000000000..41c0ac5462
--- /dev/null
+++ b/site/content/docs/5.0/helpers/stacks.md
@@ -0,0 +1,82 @@
+---
+layout: docs
+title: Stacks
+description: Shorthand helpers that build on top of our flexbox utilities to make component layout faster and easier than ever.
+group: helpers
+toc: true
+---
+
+Stacks offer a shortcut for applying a number of flexbox properties to quickly and easily create layouts in Bootstrap. All credit for the concept and implementation goes to the open source [Pylon project](https://almonk.github.io/pylon/).
+
+## Vertical
+
+Use `.vstack` to create vertical layouts. Stacked items are full-width by default. Use `.gap-*` utilities to add space between items.
+
+{{< example >}}
+
+
First item
+
Second item
+
Third item
+
+{{< /example >}}
+
+## Horizontal
+
+Use `.hstack` for horizontal layouts. Stacked items are vertically centered by default and only take up their necessary width. Use `.gap-*` utilities to add space between items.
+
+{{< example >}}
+
+
First item
+
Second item
+
Third item
+
+{{< /example >}}
+
+Using horizontal margin utilities like `.ms-auto` as spacers:
+
+{{< example >}}
+
+
First item
+
Second item
+
Third item
+
+{{< /example >}}
+
+
+
+
+
+{{< example >}}
+
+
First item
+
Second item
+
+
Third item
+
+{{< /example >}}
+
+## Examples
+
+Use `.vstack` to stack buttons and other elements:
+
+{{< example >}}
+
+
+
+
+{{< /example >}}
+
+Create an inline form with `.hstack`:
+
+{{< example >}}
+