Merge ed1dd93bdbfe4f6c99bf67076b3bdd860ce47559 into 0458e76ec1e51c3b8edcecfeb43feea58143f36d

scss/_utilities.scss

@@ -347,6 +347,19 @@ $utilities: map-merge(
       ),
     ),
     // scss-docs-end utils-flex
+    // Animation direction utilities
+    // scss-docs-start utils-animation-direction
+    "animation-direction": (
+      property: animation-direction,
+      class: animation-direction,
+      values: (
+        normal: normal,
+        reverse: reverse,
+        alternate: alternate,
+        alternate-reverse: alternate-reverse,
+      )
+    ),
+    // scss-docs-end utils-animation-direction
     // Margin utilities
     // scss-docs-start utils-spacing
     "margin": (

site/content/docs/5.3/utilities/animation-direction.md

@@ -0,0 +1,30 @@
+---
+layout: docs
+title: Animation direction
+description: Control the animation direction of elements with animation-direction utilities.
+group: utilities
+---
+
+Set the `animation direction` of elements with our animation-direction utilities. 
+
+Add `.animation-direction-reverse`, `.animation-direction-alternate` or `.animation-direction-alternate-reverse` as needed.
+
+{{< example >}}
+<div class="spinner-border animation-direction-reverse" role="status">
+    <span class="visually-hidden">Loading...</span>
+</div>
+<div class="spinner-grow animation-direction-reverse" style="width: 3rem; height: 3rem;" role="status">
+  <span class="visually-hidden">Loading...</span>
+</div>
+<div class="spinner-border animation-direction-alternate" role="status">
+    <span class="visually-hidden">Loading...</span>
+</div>
+{{< /example >}}
+
+## Sass
+
+### Utilities API
+
+Animation direction utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
+
+{{< scss-docs name="utils-animation-direction" file="scss/_utilities.scss" >}}

site/data/sidebar.yml

@@ -118,6 +118,7 @@
   icon: braces-asterisk
   icon_color: red
   pages:
+    - title: Animation direction
     - title: API
     - title: Background
     - title: Borders