diff --git a/Base/res/html/misc/flex-order.html b/Base/res/html/misc/flex-order.html
index c0f328934e..e065aa55b2 100644
--- a/Base/res/html/misc/flex-order.html
+++ b/Base/res/html/misc/flex-order.html
@@ -76,6 +76,12 @@
     <div class="box" style="order: 1;flex: 80% 0 1;">2</div>
     <div class="box" style="flex: 80% 0 0;">3</div>
 </div>
+<p>1/1/<> - reverse</p>
+<div class="my-container" style="flex-direction: row-reverse; width: 500px;">
+    <div class="box" style="order: 1;flex: 80% 0 4;">1</div>
+    <div class="box" style="order: 1;flex: 80% 0 1;">2</div>
+    <div class="box" style="flex: 80% 0 0;">3</div>
+</div>
 <p>3/-1/-2</p>
 <div class="my-container" style="width: 500px;">
     <div class="box" style="order: 3;flex: 80% 0 4;">1</div>
diff --git a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
index 74ce0b9afc..de64b3d631 100644
--- a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
+++ b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp
@@ -48,8 +48,6 @@ void FlexFormattingContext::run(Box const& run_box, LayoutMode)
 
     // This implements https://www.w3.org/TR/css-flexbox-1/#layout-algorithm
 
-    // FIXME: Implement reverse and ordering.
-
     // 1. Generate anonymous flex items
     generate_anonymous_flex_items();
 
@@ -203,13 +201,25 @@ void FlexFormattingContext::generate_anonymous_flex_items()
     });
 
     auto keys = order_item_bucket.keys();
-    quick_sort(keys, [](auto& a, auto& b) { return a < b; });
+
+    if (is_direction_reverse()) {
+        quick_sort(keys, [](auto& a, auto& b) { return a > b; });
+    } else {
+        quick_sort(keys, [](auto& a, auto& b) { return a < b; });
+    }
 
     for (auto key : keys) {
         auto order_bucket = order_item_bucket.get(key);
         if (order_bucket.has_value()) {
-            for (auto flex_item : order_bucket.value()) {
-                m_flex_items.append(move(flex_item));
+            auto items = order_bucket.value();
+            if (is_direction_reverse()) {
+                for (auto flex_item : items.in_reverse()) {
+                    m_flex_items.append(move(flex_item));
+                }
+            } else {
+                for (auto flex_item : items) {
+                    m_flex_items.append(move(flex_item));
+                }
             }
         }
     }
diff --git a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h
index d6d50bb2a1..71b28718be 100644
--- a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h
+++ b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.h
@@ -118,7 +118,7 @@ private:
 
     bool is_row_layout() const { return m_flex_direction == CSS::FlexDirection::Row || m_flex_direction == CSS::FlexDirection::RowReverse; }
     bool is_single_line() const { return flex_container().computed_values().flex_wrap() == CSS::FlexWrap::Nowrap; }
-
+    bool is_direction_reverse() const { return m_flex_direction == CSS::FlexDirection::ColumnReverse || m_flex_direction == CSS::FlexDirection::RowReverse; }
     void populate_specified_margins(FlexItem&, CSS::FlexDirection) const;
 
     FormattingState::NodeState& m_flex_container_state;