diff --git a/.changeset/cool-dolls-raise.md b/.changeset/cool-dolls-raise.md
new file mode 100644
index 000000000..8b015996a
--- /dev/null
+++ b/.changeset/cool-dolls-raise.md
@@ -0,0 +1,5 @@
+---
+'@cloudfour/patterns': minor
+---
+
+Add clearfix utility
diff --git a/package-lock.json b/package-lock.json
index af102b1c0..de63509fd 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@cloudfour/patterns",
-  "version": "11.0.0",
+  "version": "11.2.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@cloudfour/patterns",
-      "version": "11.0.0",
+      "version": "11.2.1",
       "license": "MIT",
       "dependencies": {
         "focus-visible": "5.2.0",
diff --git a/src/utilities/display/demo/clearfix.twig b/src/utilities/display/demo/clearfix.twig
new file mode 100644
index 000000000..10e7f831a
--- /dev/null
+++ b/src/utilities/display/demo/clearfix.twig
@@ -0,0 +1,3 @@
+<div class="u-clearfix" style="border: 3px solid black; padding: 15px">
+  <div style="width: 500px; height: 500px; background: green; float: right">I'm floating!</div>
+</div>
diff --git a/src/utilities/display/display.scss b/src/utilities/display/display.scss
index 2c413da95..780570048 100644
--- a/src/utilities/display/display.scss
+++ b/src/utilities/display/display.scss
@@ -7,3 +7,13 @@
 .u-hidden-visually {
   @include a11y.sr-only($important: true);
 }
+
+/**
+ * Clearfix: forces a container to expand to fit floated children
+ * https://www.cssmojo.com/latest-new-clearfix-so-far/
+ */
+.u-clearfix::after {
+  clear: both;
+  content: '';
+  display: block;
+}
diff --git a/src/utilities/display/display.stories.mdx b/src/utilities/display/display.stories.mdx
index d2cb1938c..86c73f2ed 100644
--- a/src/utilities/display/display.stories.mdx
+++ b/src/utilities/display/display.stories.mdx
@@ -1,5 +1,6 @@
 import { Canvas, Meta, Story } from '@storybook/addon-docs';
 import hiddenVisuallyDemo from './demo/hidden-visually.twig';
+import clearfixDemo from './demo/clearfix.twig';
 
 <Meta title="Utilities/Display" />
 
@@ -21,3 +22,11 @@ In this example, the link will include text when read aloud:
 <Canvas>
   <Story name="Hidden Visually">{hiddenVisuallyDemo}</Story>
 </Canvas>
+
+## Clearfix
+
+The `u-clearfix` class forces a container to expand to fit floated children.
+
+<Canvas>
+  <Story name="Clearfix">{clearfixDemo}</Story>
+</Canvas>